create-react-app 在scss文件中,url()中的Leading slah已被移除,

yws3nbqq  于 2个月前  发布在  React
关注(0)|答案(1)|浏览(50)

描述bug

我在scss文件中设置了一个路径,指向我需要从域根引用的资源。自v4版本以来,css-loader默认尝试将css引用解析为src文件夹。我尝试使用react-app-rewired为css-loader设置{ url: false }选项,现在它不再是complains about the missing reference,但出于某种原因,前导斜杠仍然被剥离。
url('/path/to/file') -> url('path/to/file')

你是否尝试恢复依赖项?

是的,npm版本:6.14.17

环境

create-react-app的当前版本:5.0.1
正在运行/Users/323782896/.npm/_npx/61421/lib/node_modules/create-react-app
系统:
操作系统:macOS 12.4
CPU:(8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
二进制文件:
Node:14.17.4 - /usr/local/bin/node
Yarn:未找到
npm:6.14.17 - /usr/local/bin/npm
浏览器:
Chrome:103.0.5060.114
Edge:未找到
Firefox:101.0
Safari:15.5
npmPackages:
react:^17.0.2 => 17.0.2
react-dom:^17.0.2 => 17.0.2
react-scripts:^4.0.3 => 4.0.3
npmGlobalPackages:
create-react-app:未找到

重现步骤

  1. 使用react-app-rewired将css-loader的url选项设置为false以使用未解析的引用
// config-overrides.js

const { override, adjustStyleLoaders } = require('customize-cra');

module.exports = override(
  adjustStyleLoaders(({ use: [miniExtract, css, postcss, resolveUrl, sass] }) => {
    css.options = { ...css.options, url: false };
  })
);
  1. react-app-rewired startreact-app-rewired build

预期行为

url('/path/to/file')

实际行为

g6ll5ycj

g6ll5ycj1#

Turns out the issue was the resolve-url-loader . 通过移除 root 选项解决了这个问题。在这之前有什么变化吗?在升级到 CRA 4 之前没有遇到过这个问题。

相关问题