You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I import an SCSS file from a package in node_modules that in-turn imports a different SCSS file from another package in node_modules.
What I expect is that the imports in each SCSS file resolve with the same kind of rules, so I expect both imports to pull from node_modules.
What appears to happen is that the first resolution occurs in to the SCSS file in node_modules but the second resolution behaves like a relative path import and fails (guessing the second import is not getting the same load paths configured).
I'm not quite sure but I believe this could be related to #10340.
[plugin:vite:css] [postcss] Failed to find '../node_modules/@ni/nimble-components/dist/@ni/nimble-tokens/dist/fonts/css/fonts.css'
in [
/home/projects/vite-sass-transitive-import/src
]
at eval (file://file:///home/projects/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-53dc1ef4.js:108:13)
at async Promise.all (index 0)
at async LazyResult.runAsync (file:///home/projects/vite-sass-transitive-import/node_modules/postcss/lib/lazy-result.js:396:11)
at async compileCSS (file://file:///home/projects/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:36784:25)
at async TransformContext.transform (file://file:///home/projects/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:36245:56)
at async Object.transform (file://file:///home/projects/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:41733:30)
at async loadAndTransform (file://file:///home/projects/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:39527:29
Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
Describe the bug
I import an SCSS file from a package in node_modules that in-turn imports a different SCSS file from another package in node_modules.
What I expect is that the imports in each SCSS file resolve with the same kind of rules, so I expect both imports to pull from node_modules.
What appears to happen is that the first resolution occurs in to the SCSS file in node_modules but the second resolution behaves like a relative path import and fails (guessing the second import is not getting the same load paths configured).
I'm not quite sure but I believe this could be related to #10340.
Reproduction
https://stackblitz.com/edit/vite-sass-transitive-import?file=src%2Fstyle.scss
Steps to reproduce
The stackblitz shows the full reproduction and error when running the
npm run dev
command.The following shows the example:
Which results in the error:
System Info
Used Package Manager
npm
Logs
Expand to see logs
C:\Users\Milan\Downloads\vite-sass-transitive-import>npm run devvite:config no config file found. +0ms
vite:esbuild init tsconfck (root: C:/Users/Milan/Downloads/vite-sass-transitive-import) +0ms
vite:esbuild init tsconfck (root: C:/Users/Milan/Downloads/vite-sass-transitive-import) +3ms
vite:esbuild init tsconfck end +2ms
vite:esbuild init tsconfck end +0ms
vite:config using resolved config: {
vite:config root: 'C:/Users/Milan/Downloads/vite-sass-transitive-import',
vite:config base: '/',
vite:config mode: 'development',
vite:config configFile: undefined,
vite:config logLevel: undefined,
vite:config clearScreen: undefined,
vite:config optimizeDeps: {
vite:config disabled: 'build',
vite:config force: undefined,
vite:config esbuildOptions: { preserveSymlinks: false }
vite:config },
vite:config server: {
vite:config preTransformRequests: true,
vite:config middlewareMode: false,
vite:config fs: { strict: true, allow: [Array], deny: [Array] }
vite:config },
vite:config configFileDependencies: [],
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 optimizeDeps: { force: undefined },
vite:config server: {}
vite:config },
vite:config rawBase: '/',
vite:config resolve: {
vite:config mainFields: [ 'module', 'jsnext:main', 'jsnext' ],
vite:config browserField: true,
vite:config conditions: [],
vite:config extensions: [
vite:config '.mjs', '.js',
vite:config '.mts', '.ts',
vite:config '.jsx', '.tsx',
vite:config '.json'
vite:config ],
vite:config dedupe: [],
vite:config preserveSymlinks: false,
vite:config alias: [ [Object], [Object] ]
vite:config },
vite:config publicDir: 'C:\Users\Milan\Downloads\vite-sass-transitive-import\public',
vite:config cacheDir: 'C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/.vite',
vite:config command: 'serve',
vite:config ssr: {
vite:config format: 'esm',
vite:config target: 'node',
vite:config optimizeDeps: { disabled: true, esbuildOptions: [Object] }
vite:config },
vite:config isWorker: false,
vite:config mainConfig: null,
vite:config isProduction: false,
vite:config plugins: [
vite:config 'vite:pre-alias',
vite:config 'alias',
vite:config 'vite:modulepreload-polyfill',
vite:config 'vite:optimized-deps',
vite:config 'vite:resolve',
vite:config 'vite:html-inline-proxy',
vite:config 'vite:css',
vite:config 'vite:esbuild',
vite:config 'vite:json',
vite:config 'vite:wasm-helper',
vite:config 'vite:worker',
vite:config 'vite:asset',
vite:config 'vite:wasm-fallback',
vite:config 'vite:define',
vite:config 'vite:css-post',
vite:config 'vite:worker-import-meta-url',
vite:config 'vite:asset-import-meta-url',
vite:config 'vite:dynamic-import-vars',
vite:config 'vite:import-glob',
vite:config 'vite:client-inject',
vite:config 'vite:import-analysis'
vite:config ],
vite:config build: {
vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
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 minify: 'esbuild',
vite:config terserOptions: {},
vite:config write: true,
vite:config emptyOutDir: null,
vite:config copyPublicDir: true,
vite:config manifest: false,
vite:config lib: false,
vite:config ssr: false,
vite:config ssrManifest: false,
vite:config ssrEmitAssets: false,
vite:config reportCompressedSize: true,
vite:config chunkSizeWarningLimit: 500,
vite:config watch: null,
vite:config commonjsOptions: { include: [Array], extensions: [Array] },
vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] },
vite:config modulePreload: { polyfill: true }
vite:config },
vite:config preview: {
vite:config port: undefined,
vite:config strictPort: undefined,
vite:config host: undefined,
vite:config https: undefined,
vite:config open: undefined,
vite:config proxy: undefined,
vite:config cors: undefined,
vite:config headers: undefined
vite:config },
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 warnOnce: [Function: warnOnce],
vite:config error: [Function: error],
vite:config clearScreen: [Function: clearScreen],
vite:config hasErrorLogged: [Function: hasErrorLogged]
vite:config },
vite:config packageCache: Map(0) {},
vite:config createResolver: [Function: createResolver],
vite:config worker: {
vite:config format: 'iife',
vite:config plugins: [
vite:config 'vite:pre-alias',
vite:config 'alias',
vite:config 'vite:modulepreload-polyfill',
vite:config 'vite:optimized-deps',
vite:config 'vite:resolve',
vite:config 'vite:html-inline-proxy',
vite:config 'vite:css',
vite:config 'vite:esbuild',
vite:config 'vite:json',
vite:config 'vite:wasm-helper',
vite:config 'vite:worker',
vite:config 'vite:asset',
vite:config 'vite:wasm-fallback',
vite:config 'vite:define',
vite:config 'vite:css-post',
vite:config 'vite:worker-import-meta-url',
vite:config 'vite:asset-import-meta-url',
vite:config 'vite:dynamic-import-vars',
vite:config 'vite:import-glob',
vite:config 'vite:client-inject',
vite:config 'vite:import-analysis'
vite:config ],
vite:config rollupOptions: {},
vite:config getSortedPlugins: [Function: getSortedPlugins],
vite:config getSortedPluginHooks: [Function: getSortedPluginHooks]
vite:config },
vite:config appType: 'spa',
vite:config experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false },
vite:config getSortedPlugins: [Function: getSortedPlugins],
vite:config getSortedPluginHooks: [Function: getSortedPluginHooks]
vite:config } +15ms
vite:deps scanning for dependencies... +0ms
VITE v4.1.4 ready in 218 ms
➜ Local: http://127.0.0.1:5173/
➜ Network: use --host to expose
➜ press h to show help
vite:deps Crawling dependencies using entries:
vite:deps C:/Users/Milan/Downloads/vite-sass-transitive-import/index.html +0ms
vite:deps Scan completed in 44.40ms: {} +26ms
vite:deps no dependencies found by scanner +46ms
vite:html-fallback Rewriting GET / to /index.html +0ms
vite:time 23.68ms /index.html +0ms
vite:resolve 4.64ms C:\Users\Milan\Downloads\vite-sass-transitive-import\node_modules\vite\dist\client\client.mjs -> C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/client/client.mjs +0ms
vite:resolve 5.91ms /@vite/client -> C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/client/client.mjs +1ms
vite:resolve 1.30ms /src/style.scss?direct -> C:/Users/Milan/Downloads/vite-sass-transitive-import/src/style.scss?direct +5ms
vite:load 6.31ms [fs] /@vite/client +0ms
vite:load 3.16ms [fs] /src/style.scss?direct +2ms
vite:resolve 2.39ms C:\Users\Milan\Downloads\vite-sass-transitive-import\node_modules\vite\dist\client\env.mjs -> C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/client/env.mjs +34ms
vite:resolve 2.85ms @vite/env -> C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/client/env.mjs +0ms
vite:resolve 0.58ms /node_modules/vite/dist/client/env.mjs -> C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/client/env.mjs +1ms
vite:import-analysis 8.12ms [1 imports rewritten] node_modules\vite\dist\client\client.mjs +0ms
vite:transform 27.47ms /@vite/client +0ms
vite:time 51.04ms /@vite/client +82ms
vite:load 1.23ms [fs] /node_modules/vite/dist/client/env.mjs +36ms
vite:import-analysis 0.07ms [no imports] node_modules\vite\dist\client\env.mjs +6ms
vite:transform 1.28ms /node_modules/vite/dist/client/env.mjs +5ms
vite:cache [304] /node_modules/vite/dist/client/env.mjs +0ms
vite:time 0.84ms /node_modules/vite/dist/client/env.mjs +7ms
vite:resolve 10.72ms @ni/nimble-components/dist/fonts.scss -> C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/@ni/nimble-components/dist/fonts.scss +0ms
vite:resolve 2.41ms ../node_modules/@ni/nimble-components/dist/@ni/nimble-tokens/dist/fonts/css/fonts.css -> null +0ms
10:24:08 PM [vite] Internal server error: [postcss] Failed to find '../node_modules/@ni/nimble-components/dist/@ni/nimble-tokens/dist/fonts/css/fonts.css'
in [
C:/Users/Milan/Downloads/vite-sass-transitive-import/src
]
Plugin: vite:css
File: C:/Users/Milan/Downloads/vite-sass-transitive-import/src/style.scss?direct:undefined:undefined
at file:///C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-53dc1ef4.js:93:13
at async Promise.all (index 0)
at async LazyResult.runAsync (C:\Users\Milan\Downloads\vite-sass-transitive-import\node_modules\postcss\lib\lazy-result.js:396:11)
at async compileCSS (file:///C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:36736:25)
at async TransformContext.transform (file:///C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:36197:56)
at async Object.transform (file:///C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:41685:30)
at async loadAndTransform (file:///C:/Users/Milan/Downloads/vite-sass-transitive-import/node_modules/vite/dist/node/chunks/dep-ca21228b.js:39479:29)
vite:time 360.99ms /src/style.scss +313ms
vite:deps ✨ static imports crawl ended +2m
vite:deps ✨ no dependencies found by the scanner or crawling static imports +0ms
Validations
The text was updated successfully, but these errors were encountered: