build: requested assets name __VITE_ASSET__hash__ doesn't match the generated assets file name

[CarterLi]

⚠️ IMPORTANT ⚠️ Please check the following list before proceeding. If you ignore this issue template, your issue will be directly closed.

• Read the docs.
• Use Vite >=2.0. (1.x is no longer supported)
• If the issue is related to 1.x -> 2.0 upgrade, read the Migration Guide first.

Describe the bug

I'm using fontawesome 4.7. Development env works fine. But when the project is built and published, all icon can't be properly displayed, because the requested url .../assets/__VITE_ASSET__933c617f__?v=4.7.0__

doesn't match the generated assets filename fontawesome-webfont.9dc6938e.woff2

Reproduction

Please provide a link to a repo that can reproduce the problem you ran into.

1. yarn create @vitejs/app, select vue-ts
2. cd vite-project
3. yarn add font-awesome@^4.7.0

in main.ts

1. import 'font-awesome/css/font-awesome.css';

in App.vue

1. <i class="fa fa-circle"></i>

then

1. yarn build
2. cd dist
3. caddy file-server

System Info

• vite version: 2.0.0-beta.34
• Operating System: macOS 11.1
• Node version: v15.6.0
• Package manager (npm/yarn/pnpm) and version: yarn v1.22.10

Logs (Optional if provided reproduction)

1. Run vite or vite build with the --debug flag.
2. Provide the error log here.

$ yarn build --debug                                                     8s  三  1/20 10:31:22 2021
yarn run v1.22.10
warning package.json: No license field
$ vuedx-typecheck . && vite build --debug
Running for /Users/Carter/vite-project

Found 0 errors.  vite:config bundled config file loaded in 170ms +0ms
  vite:config using resolved config: {
  vite:config   plugins: [
  vite:config     'alias',
  vite:config     'vite:dynamic-import-polyfill',
  vite:config     'vite:resolve',
  vite:config     'vite:html',
  vite:config     'vite:css',
  vite:config     'vite:esbuild',
  vite:config     'vite:json',
  vite:config     'vite:wasm',
  vite:config     'vite:worker',
  vite:config     'vite:asset',
  vite:config     'vite:vue',
  vite:config     'vite:css-post',
  vite:config     'vite:build-html',
  vite:config     'commonjs',
  vite:config     'vite:data-uri',
  vite:config     'vite:define',
  vite:config     'rollup-plugin-dynamic-import-variables',
  vite:config     'vite:import-analysis',
  vite:config     'vite:esbuild-transpile',
  vite:config     'vite:terser',
  vite:config     'vite:size'
  vite:config   ],
  vite:config   build: {
  vite:config     base: '/',
  vite:config     target: [ 'es2019', 'edge16', 'firefox60', 'chrome61', 'safari11' ],
  vite:config     polyfillDynamicImport: true,
  vite:config     outDir: 'dist',
  vite:config     assetsDir: 'assets',
  vite:config     assetsInlineLimit: 4096,
  vite:config     cssCodeSplit: true,
  vite:config     sourcemap: false,
  vite:config     rollupOptions: {},
  vite:config     commonjsOptions: { include: [Array], extensions: [Array] },
  vite:config     minify: 'terser',
  vite:config     terserOptions: {},
  vite:config     cleanCssOptions: {},
  vite:config     write: true,
  vite:config     emptyOutDir: null,
  vite:config     manifest: false,
  vite:config     lib: false,
  vite:config     ssr: false,
  vite:config     ssrManifest: false
  vite:config   },
  vite:config   define: { __VUE_OPTIONS_API__: true, __VUE_PROD_DEVTOOLS__: false },
  vite:config   ssr: { external: [ 'vue', '@vue/server-renderer' ] },
  vite:config   configFile: '/Users/Carter/vite-project/vite.config.ts',
  vite:config   inlineConfig: {
  vite:config     root: undefined,
  vite:config     mode: undefined,
  vite:config     configFile: undefined,
  vite:config     logLevel: undefined,
  vite:config     clearScreen: undefined,
  vite:config     build: {}
  vite:config   },
  vite:config   root: '/Users/Carter/vite-project',
  vite:config   command: 'build',
  vite:config   mode: 'production',
  vite:config   isProduction: true,
  vite:config   optimizeCacheDir: '/Users/Carter/vite-project/node_modules/.vite',
  vite:config   alias: [
  vite:config     {
  vite:config       find: /^\/@vite\//,
  vite:config       replacement: '/Users/Carter/vite-project/node_modules/vite/dist/client/'
  vite:config     }
  vite:config   ],
  vite:config   server: {},
  vite:config   env: { BASE_URL: '/', MODE: 'production', DEV: false, PROD: true },
  vite:config   assetsInclude: [Function: assetsInclude],
  vite:config   logger: {
  vite:config     info: [Function: info],
  vite:config     warn: [Function: warn],
  vite:config     error: [Function: error],
  vite:config     clearScreen: [Function: clearScreen]
  vite:config   }
  vite:config } +4ms
building for production...
dist/assets/logo.3b714202.png                    6.69kb
dist/assets/fontawesome-webfont.12d528dc.eot     161.86kb
dist/assets/fontawesome-webfont.9dc6938e.woff2   75.35kb
dist/assets/fontawesome-webfont.a3e8aecc.woff    95.73kb
dist/assets/fontawesome-webfont.5d9e2a46.ttf     161.67kb
dist/assets/fontawesome-webfont.ec4ac7f0.svg     433.96kb
dist/assets/index.a979c728.js                    44.46kb / brotli: 16.03kb
dist/assets/index.aabba8a0.css                   29.90kb / brotli: 5.47kb
dist/index.html                                  0.39kb
✨  Done in 10.15s.