sveltejs/svelte-preprocess

Cannot import SCSS from Node.js modules with Yarn 2 (Yarn PnP)

Open

#283 建立於 2020年11月24日

在 GitHub 查看
 (1 留言) (1 反應) (0 負責人)TypeScript (150 fork)auto 404
help wanted

倉庫指標

Star
 (1,798 star)
PR 合併指標
 (PR 指標待抓取)

描述

Describe the bug Importing SCSS from Node.js modules does not work with Yarn 2.

<style lang="scss">
  @import "demo-scss-npm-module";
</style>

Yields:

Error: Can't find stylesheet to import.
  ╷
2 │   @import "demo-scss-npm-module";
  │           ^^^^^^^^^^^^^^^^^^^^^^
  ╵
  foo.svelte 2:11

To Reproduce See this repo: https://github.com/joelmukuthu/svelte-preprocess-yarn-2-scss-bug

Expected behavior That the external SCSS would be imported. This currently works with Yarn 1.

Stacktraces

[webpack-cli] Compilation finished
assets by status 1.98 KiB [cached] 1 asset
./foo.svelte 39 bytes [built] [code generated] [1 error]

ERROR in ./foo.svelte
Module build failed (from ./.yarn/$$virtual/svelte-loader-virtual-fc743d5c72/0/cache/svelte-loader-npm-2.13.6-8655b244a1-84b6908665.zip/node_modules/svelte-loader/index.js):
Error: Can't find stylesheet to import.
  ╷
2 │   @import "demo-scss-npm-module";
  │           ^^^^^^^^^^^^^^^^^^^^^^
  ╵
  foo.svelte 2:11  root stylesheet
    at Object._newRenderError (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:13472:19)
    at Object._wrapException (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:13315:16)
    at _render_closure1.call$2 (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:79617:21)
    at _RootZone.runBinary$3$3 (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:27035:18)
    at _FutureListener.handleError$1 (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:25563:19)
    at _Future__propagateToListeners_handleError.call$0 (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:25860:49)
    at Object._Future__propagateToListeners (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:4539:77)
    at _Future._completeError$2 (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:25693:9)
    at _AsyncAwaitCompleter.completeError$2 (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:25036:12)
    at Object._asyncRethrow (./foo/.yarn/cache/sass-npm-1.29.0-9787eb1c3f-8114e0c4e7.zip/node_modules/sass/sass.dart.js:4288:17)

Information about your project:

  • Your operating system: Ubuntu Linux 20.04

  • svelte-preprocess version: 4.6.1

  • The project uses Webpack, but it's inconsequential since I can reproduce the same error with the Svelte for VSCode extension. The currently-latest version of svelte-loader doesn't support Webpack 5, but this issue happens before svelte-loaders incompatibility kicks in.

貢獻者指南