style.scss has no corresponding SFC entry in the cache #1542

chriscalo · 2021-01-15T04:44:37Z

⚠️ 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 linking to SCSS files from a Vue SFC:

<template>
  <!-- … -->
</template>

<style lang="scss" src="~/style/style.scss"/>

This works with the dev server, but fails when I try to build:

yarn build

Output:

yarn run v1.22.10
warning package.json: No license field
$ vite build
building for production...
[vite:vue] /Users/ccalo/Projects/vite-multipage/style/style.scss has no corresponding SFC entry in the cache. This is a @vitejs/plugin-vue internal error, please open an issue.
file: /Users/ccalo/Projects/vite-multipage/style/style.scss?vue&type=style&index=0&src&lang.scss
error during build:
Error: /Users/ccalo/Projects/vite-multipage/style/style.scss has no corresponding SFC entry in the cache. This is a @vitejs/plugin-vue internal error, please open an issue.
    at getDescriptor (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4410:11)
    at Object.transform (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4990:28)
    at /Users/ccalo/Projects/vite-multipage/node_modules/rollup/dist/shared/rollup.js:18781:25
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Reproduction

https://github.com/chriscalo/vite-multipage/

System Info

vite version: 2.0.0-beta.29 from yarn.lock
Operating System: macOS Big Sur version 11.1 (20C69)
Node version: v14.15.4
Package manager (npm/yarn/pnpm) and version: yarn v1.22.10

Logs (Optional if provided reproduction)

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

$ vite build --debug
  vite:config bundled config file loaded in 160ms +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   alias: [
  vite:config     {
  vite:config       find: /^\/@vite\//,
  vite:config       replacement: '/Users/ccalo/Projects/vite-multipage/node_modules/vite/dist/client/'
  vite:config     },
  vite:config     { find: '~', replacement: '/Users/ccalo/Projects/vite-multipage' }
  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: { input: [Object] },
  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   },
  vite:config   define: { __VUE_OPTIONS_API__: true, __VUE_PROD_DEVTOOLS__: false },
  vite:config   configFile: '/Users/ccalo/Projects/vite-multipage/vite.config.js',
  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/ccalo/Projects/vite-multipage',
  vite:config   command: 'build',
  vite:config   mode: 'production',
  vite:config   isProduction: true,
  vite:config   optimizeCacheDir: '/Users/ccalo/Projects/vite-multipage/node_modules/.vite',
  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...
[vite:vue] /Users/ccalo/Projects/vite-multipage/style/style.scss has no corresponding SFC entry in the cache. This is a @vitejs/plugin-vue internal error, please open an issue.
file: /Users/ccalo/Projects/vite-multipage/style/style.scss?vue&type=style&index=0&src&lang.scss
error during build:
Error: /Users/ccalo/Projects/vite-multipage/style/style.scss has no corresponding SFC entry in the cache. This is a @vitejs/plugin-vue internal error, please open an issue.
    at getDescriptor (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4410:11)
    at Object.transform (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4990:28)
    at /Users/ccalo/Projects/vite-multipage/node_modules/rollup/dist/shared/rollup.js:18781:25
error Command failed with exit code 1.

The text was updated successfully, but these errors were encountered:

fix vitejs#1542

fix #1542

chriscalo · 2021-01-25T00:03:55Z

Seems the attempted fix didn't work for me.

It also turns out I was wrong when I said this was only an issue for vite build. I think something must have been cached by the vite dev server that hid the error because I ended up seeing the same problem when I stopped and re-ran vite.

Here's the output of vite --debug:

ccalo-imacpro:vite-multipage ccalo$ yarn vite --debug
yarn run v1.22.10
warning package.json: No license field
$ /Users/ccalo/Projects/vite-multipage/node_modules/.bin/vite --debug
  vite:config bundled config file loaded in 129ms +0ms
  vite:config using resolved config: {
  vite:config   plugins: [
  vite:config     'vite:pre-alias',
  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:client-inject',
  vite:config     'vite:import-analysis'
  vite:config   ],
  vite:config   alias: [
  vite:config     {
  vite:config       find: /^\/@vite\//,
  vite:config       replacement: '/Users/ccalo/Projects/vite-multipage/node_modules/vite/dist/client/'
  vite:config     },
  vite:config     { find: '~', replacement: '/Users/ccalo/Projects/vite-multipage' }
  vite:config   ],
  vite:config   build: {
  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: { input: [Object] },
  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   server: { hmr: { path: undefined } },
  vite:config   define: { __VUE_OPTIONS_API__: true, __VUE_PROD_DEVTOOLS__: false },
  vite:config   configFile: '/Users/ccalo/Projects/vite-multipage/vite.config.js',
  vite:config   inlineConfig: {
  vite:config     root: undefined,
  vite:config     base: undefined,
  vite:config     mode: undefined,
  vite:config     configFile: undefined,
  vite:config     logLevel: undefined,
  vite:config     clearScreen: undefined,
  vite:config     server: {}
  vite:config   },
  vite:config   root: '/Users/ccalo/Projects/vite-multipage',
  vite:config   command: 'serve',
  vite:config   mode: 'development',
  vite:config   isProduction: false,
  vite:config   optimizeCacheDir: '/Users/ccalo/Projects/vite-multipage/node_modules/.vite',
  vite:config   env: { BASE_URL: '/', MODE: 'development', DEV: true, PROD: false },
  vite:config   assetsInclude: [Function: assetsInclude],
  vite:config   logger: {
  vite:config     hasWarned: false,
  vite:config     info: [Function: info],
  vite:config     warn: [Function: warn],
  vite:config     error: [Function: error],
  vite:config     clearScreen: [Function: clearScreen]
  vite:config   },
  vite:config   base: '/'
  vite:config } +3ms
  vite:optimize Hash is consistent. Skipping. Use --force to override. +0ms

  Vite dev server running at:

  > Local:    http://localhost:3000/
  > Network:  http://192.168.1.177:3000/
  > Network:  http://192.168.86.182:3000/

  ready in 276ms.

  vite:spa-fallback Rewriting GET / to /index.html +0ms
  vite:time 13ms  /index.html +0ms
  vite:spa-fallback Rewriting GET / to /index.html +26ms
  vite:time 1ms   /index.html +15ms
  vite:resolve 1ms   /@vite/client -> /Users/ccalo/Projects/vite-multipage/node_modules/vite/dist/client/client.js +0ms
  vite:resolve 0ms   /index.html?html-proxy&index=0.js -> /Users/ccalo/Projects/vite-multipage/index.html?html-proxy&index=0.js +3ms
  vite:load 0ms   [plugin] /index.html?html-proxy&index=0.js +0ms
  vite:resolve 0ms   vue -> /Users/ccalo/Projects/vite-multipage/node_modules/.vite/vue.runtime.esm-bundler.js?v=bc334bb1 +3ms
  vite:resolve 0ms   /node_modules/.vite/vue.runtime.esm-bundler.js?v=bc334bb1 -> /Users/ccalo/Projects/vite-multipage/node_modules/.vite/vue.runtime.esm-bundler.js?v=bc334bb1 +0ms
  vite:resolve 1ms   ./Home.vue -> /Users/ccalo/Projects/vite-multipage/Home.vue +1ms
  vite:resolve 0ms   /Home.vue -> /Users/ccalo/Projects/vite-multipage/Home.vue +0ms
  vite:transform 3ms   /index.html?html-proxy&index=0.js +0ms
  vite:time 5ms   /index.html?html-proxy&index=0.js +108ms
  vite:load 7ms   [fs] /@vite/client +5ms
  vite:transform 3ms   /@vite/client +5ms
  vite:time 13ms  /@vite/client +4ms
  vite:load 0ms   [fs] /Home.vue +4ms
[@vue/compiler-sfc] <script setup> is still an experimental proposal.
Follow its status at https://github.com/vuejs/rfcs/pull/227.

[@vue/compiler-sfc] When using experimental features,
it is recommended to pin your vue dependencies to exact versions to avoid breakage.

  vite:resolve 0ms   ~/components/Counter.vue -> /Users/ccalo/Projects/vite-multipage/components/Counter.vue +30ms
  vite:resolve 0ms   /components/Counter.vue -> /Users/ccalo/Projects/vite-multipage/components/Counter.vue +0ms
  vite:resolve 0ms   ~/components/Nav.vue -> /Users/ccalo/Projects/vite-multipage/components/Nav.vue +0ms
  vite:resolve 0ms   /components/Nav.vue -> /Users/ccalo/Projects/vite-multipage/components/Nav.vue +1ms
  vite:resolve 0ms   ~/style/style.scss?vue&type=style&index=0&src&lang.scss -> /Users/ccalo/Projects/vite-multipage/style/style.scss?vue&type=style&index=0&src&lang.scss +0ms
  vite:resolve 0ms   /style/style.scss?vue&type=style&index=0&src&lang.scss -> /Users/ccalo/Projects/vite-multipage/style/style.scss?vue&type=style&index=0&src&lang.scss +0ms
  vite:hmr [self-accepts] Home.vue +0ms
  vite:transform 25ms  /Home.vue +27ms
  vite:time 27ms  /Home.vue +27ms
  vite:load 0ms   [plugin] /style/style.scss?vue&type=style&index=0&src&lang.scss +35ms
  vite:load 3ms   [fs] /components/Counter.vue +5ms
  vite:resolve 0ms   /components/Counter.vue?vue&type=style&index=0&scoped=true&lang.css -> /Users/ccalo/Projects/vite-multipage/components/Counter.vue?vue&type=style&index=0&scoped=true&lang.css +31ms
  vite:hmr [self-accepts] components/Counter.vue +31ms
  vite:transform 17ms  /components/Counter.vue +31ms
  vite:time 20ms  /components/Counter.vue +31ms
  vite:load 21ms  [fs] /components/Nav.vue +19ms
  vite:resolve 0ms   /components/Nav.vue?vue&type=style&index=0&scoped=true&lang.css -> /Users/ccalo/Projects/vite-multipage/components/Nav.vue?vue&type=style&index=0&scoped=true&lang.css +7ms
  vite:hmr [self-accepts] components/Nav.vue +7ms
  vite:transform 4ms   /components/Nav.vue +6ms
  vite:time 26ms  /components/Nav.vue +7ms
  vite:load 0ms   [plugin] /components/Counter.vue?vue&type=style&index=0&scoped=true&lang.css +5ms
6:57:24 PM [vite] Internal server error: /Users/ccalo/Projects/vite-multipage/style/style.scss has no corresponding SFC entry in the cache. This is a @vitejs/plugin-vue internal error, please open an issue.
  Plugin: vite:vue
  File: /Users/ccalo/Projects/vite-multipage/style/style.scss?vue&type=style&index=0&src&lang.scss
      at getDescriptor (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4410:11)
      at TransformContext.transform (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4990:28)
      at Object.transform (/Users/ccalo/Projects/vite-multipage/node_modules/vite/dist/node/chunks/dep-ed31ad68.js:53834:53)
      at async transformRequest (/Users/ccalo/Projects/vite-multipage/node_modules/vite/dist/node/chunks/dep-ed31ad68.js:60394:29)
      at async /Users/ccalo/Projects/vite-multipage/node_modules/vite/dist/node/chunks/dep-ed31ad68.js:60485:32
  vite:time 232ms /style/style.scss?vue&type=style&index=0&src&lang.scss +202ms
  vite:load 0ms   [plugin] /components/Nav.vue?vue&type=style&index=0&scoped=true&lang.css +203ms
  vite:hmr [self-accepts] components/Nav.vue?vue&type=style&index=0&scoped=true&lang.css +210ms
  vite:transform 6ms   /components/Nav.vue?vue&type=style&index=0&scoped=true&lang.css +210ms
  vite:time 7ms   /components/Nav.vue?vue&type=style&index=0&scoped=true&lang.css +7ms
  vite:hmr [self-accepts] components/Counter.vue?vue&type=style&index=0&scoped=true&lang.css +2ms
  vite:transform 210ms /components/Counter.vue?vue&type=style&index=0&scoped=true&lang.css +2ms
  vite:time 211ms /components/Counter.vue?vue&type=style&index=0&scoped=true&lang.css +2ms
  vite:time 2ms   /favicon.ico +106ms

And here's the output of vite build --debug:

ccalo-imacpro:vite-multipage ccalo$ yarn build --debug
yarn run v1.22.10
warning package.json: No license field
$ vite build --debug
  vite:config bundled config file loaded in 139ms +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   alias: [
  vite:config     {
  vite:config       find: /^\/@vite\//,
  vite:config       replacement: '/Users/ccalo/Projects/vite-multipage/node_modules/vite/dist/client/'
  vite:config     },
  vite:config     { find: '~', replacement: '/Users/ccalo/Projects/vite-multipage' }
  vite:config   ],
  vite:config   build: {
  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: { input: [Object] },
  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   configFile: '/Users/ccalo/Projects/vite-multipage/vite.config.js',
  vite:config   inlineConfig: {
  vite:config     root: undefined,
  vite:config     base: 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/ccalo/Projects/vite-multipage',
  vite:config   command: 'build',
  vite:config   mode: 'production',
  vite:config   isProduction: true,
  vite:config   optimizeCacheDir: '/Users/ccalo/Projects/vite-multipage/node_modules/.vite',
  vite:config   server: { hmr: { path: undefined } },
  vite:config   env: { BASE_URL: '/', MODE: 'production', DEV: false, PROD: true },
  vite:config   assetsInclude: [Function: assetsInclude],
  vite:config   logger: {
  vite:config     hasWarned: false,
  vite:config     info: [Function: info],
  vite:config     warn: [Function: warn],
  vite:config     error: [Function: error],
  vite:config     clearScreen: [Function: clearScreen]
  vite:config   },
  vite:config   base: '/'
  vite:config } +4ms
building for production...
[vite:vue] /Users/ccalo/Projects/vite-multipage/style/style.scss has no corresponding SFC entry in the cache. This is a @vitejs/plugin-vue internal error, please open an issue.
file: /Users/ccalo/Projects/vite-multipage/style/style.scss?vue&type=style&index=0&src&lang.scss
error during build:
Error: /Users/ccalo/Projects/vite-multipage/style/style.scss has no corresponding SFC entry in the cache. This is a @vitejs/plugin-vue internal error, please open an issue.
    at getDescriptor (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4410:11)
    at Object.transform (/Users/ccalo/Projects/vite-multipage/node_modules/@vitejs/plugin-vue/dist/index.js:4990:28)
    at /Users/ccalo/Projects/vite-multipage/node_modules/rollup/dist/shared/rollup.js:18782:25
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
ccalo-imacpro:vite-multipage ccalo$

Reproduction

Same repo:
https://github.com/chriscalo/vite-multipage/

System Info

Updated:

vite version: 2.0.0-beta.47 from yarn.lock
Operating System: macOS Big Sur version 11.1 (20C69)
Node version: v14.15.4
Package manager (npm/yarn/pnpm) and version: yarn v1.22.10

yyx990803 · 2021-01-25T02:45:11Z

Did you update @vitejs/plugin-vue? The fix is in the Vue plugin, not in Vite core.

valdoryu · 2021-01-25T18:46:44Z

I got the same issue trying to use <style src=""> with the .css of an external package
I'm using @vitejs/plugin-vue@1.1.2

chriscalo · 2021-01-26T01:39:35Z

@yyx990803, apologies, you are right, I had only updated vite. all working perfectly, now 👍

chriscalo added the pending triage label Jan 15, 2021

underfin added a commit to rolldown/vite that referenced this issue Jan 15, 2021

fix(plugin-vue): sfc src import respect alias

d76cce9

fix vitejs#1542

underfin added bug and removed pending triage labels Jan 15, 2021

underfin mentioned this issue Jan 15, 2021

fix(plugin-vue): sfc src import respect alias #1544

Merged

yyx990803 closed this as completed in #1544 Jan 15, 2021

yyx990803 pushed a commit that referenced this issue Jan 15, 2021

fix(plugin-vue): sfc src import respect alias (#1544)

d8754de

fix #1542

underfin mentioned this issue Jan 16, 2021

...no corresponding SFC entry in the cache... #1561

Closed

LeBenLeBen mentioned this issue Jan 30, 2021

[@vitejs/plugin-vue] CSS has no corresponding SFC entry in the cache #1812

Closed

3 tasks

github-actions bot locked and limited conversation to collaborators Jul 16, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

style.scss has no corresponding SFC entry in the cache #1542

style.scss has no corresponding SFC entry in the cache #1542

chriscalo commented Jan 15, 2021

chriscalo commented Jan 25, 2021 •

edited

Loading

yyx990803 commented Jan 25, 2021

valdoryu commented Jan 25, 2021 •

edited

Loading

chriscalo commented Jan 26, 2021

style.scss has no corresponding SFC entry in the cache #1542

style.scss has no corresponding SFC entry in the cache #1542

Comments

chriscalo commented Jan 15, 2021

Describe the bug

Reproduction

System Info

Logs (Optional if provided reproduction)

chriscalo commented Jan 25, 2021 • edited Loading

Reproduction

System Info

yyx990803 commented Jan 25, 2021

valdoryu commented Jan 25, 2021 • edited Loading

chriscalo commented Jan 26, 2021

chriscalo commented Jan 25, 2021 •

edited

Loading

valdoryu commented Jan 25, 2021 •

edited

Loading