Yarn 2 和 dart sass 与创建反应应用程序

weg*_*gry 4 sass-loader yarnpkg

我一直在尝试更新 Create React App 以使用 yarn 2 和即插即用 (PNP)。当我在 中使用nodeLinker: node-modules.yarnrc.yml,我可以成功启动开发服务器。没有它,我最终得到

./src/App.scss (./.yarn/$$virtual/css-loader-virtual-fe3fa7be11/0/cache/css-loader-npm-3.4.2-300ee159b3-2.zip/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!./.yarn/cache/postcss-loader-npm-3.0.0-f4ab99b685-2.zip/node_modules/postcss-loader/src??postcss!./.yarn/cache/resolve-url-loader-npm-3.1.1-cf1a268137-2.zip/node_modules/resolve-url-loader??ref--6-oneOf-5-3!./.yarn/unplugged/sass-loader-virtual-14ae4e1150/node_modules/sass-loader/dist/cjs.js??ref--6-oneOf-5-4!./src/App.scss)
Error: A package is trying to access a peer dependency that should be provided by its direct ancestor but isn't

Required package: node-sass (via "node-sass")
Required by: sass-loader@virtual:74ba539c0b6c6c8346ea151c91664bff0bef13782983a6f90ddf1a26160140360771dcf40d0863b46ff7add674bc2c42a37daea25f24f4ea96f7843786460ecd#npm:8.0.2 (via /Users/me/color-contrast-matrix/.yarn/unplugged/sass-loader-virtual-14ae4e1150/node_modules/sass-loader/dist/)
Run Code Online (Sandbox Code Playgroud)

weg*_*gry 6

看起来 yarn 2 提供了一种覆盖包依赖项的方法。您必须提供缺少的依赖项,至少在这种情况下是这样。

从文档当前链接

某些包的依赖项可能指定不正确 - 例如,缺少一个依赖项,导致 Yarn 拒绝其访问。packageExtensions 字段提供了一种使用附加信息扩展现有包定义的方法。如果您使用它,请考虑向上游发送 PR 并将您的扩展程序贡献给 plugin-compat 数据库。

安装node-sass并添加此配置后,编译成功。

# .yarnrc.yml
packageExtensions:
  'sass-loader@*':
    optionalDependencies:
      node-sass: '*'
Run Code Online (Sandbox Code Playgroud)

  • @RayShan 看一下 https://github.com/wegry/yarn-2.4.0-package-extensions/pull/1/files 以获得更充实的示例。 (2认同)
  • @wegry谢谢,使用“dependency”而不是“opticalDependency”也对我有用。 (2认同)