1.错误：使用webpack5打包scss文件时，报错：

CssSyntaxError(1:1)   xxx Unknown word  import api from  xxx  ; import content from  xxx

2.详细错误：

Module build failed (from ./node_modules/css-loader/dist/cjs.js):
CssSyntaxError
(1:1) F:\reactLearning2\animation\src\css\index.scss Unknown word
> 1 | import api from "!../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js";
  2 |             import content from "!!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!../../node_modules/sass-loader/dist/cjs.js!./index.scss";
 @ ./src/css/index.scss 2:12-248 9:17-24 13:15-29
 @ ./src/js/main.js 8:0-27
webpack 5.24.3 compiled with 1 error in 26751 ms

二、错误原因及解决方法

1.错误原因：我配置了如下规则处理 scss 文件

test: /.scss$/, use: ['style-loader', loader: 'css-loader', options: { modules: true 'sass-loader'

可能是webpack5已经可以自动打包scss文件了或者webpack5内部的配置与我的配置冲突。

其实我也不太确定，但是解决方法不得不让我这么想。

2.解决方法: 在webpack配置文件中将上述配置删除即可

重新打包没有报错

1.上述错误出现的原因我也不太清楚。 2.解决方法是看了其他人使用scss文件出问题时，大部分是删除了配置就可以，所以我也试了一下，没想到竟然可以。之前想了好多办法都不行，迁移能力也很重要。 3.我测试了 css和less文件,写了配置也能正常打包;只有scss写了配置后打包时报了这个错误 。 webpack5打包报错：CssSyntaxError(1:1) xxx Unknown word import api from xxx ； import content from xxx unknown word webpack打包scss文件报错import api from xxx,import content from xxx 错误分析： HTML 网页中，浏览器通过 script 标签加载 JavaScript 脚本。由于浏览器脚本的默认语言是 JavaScript ，因此type=”application/ javascript ”可以省略。在 报错 中了解到，是说无法在模块外部使用 import 语句，因为Module 的加载实现的是es6语法，所以在浏览器加载html文件时，需要在script 标签中加入type=”module”属性。 解决办法： ERROR in ./src/index.tsx Module build failed (from ./node_modules/ css -loader/dist/cjs.js): Css SyntaxError (2:1) Unknown word var content = require("!!./index.tsx"); if(typeof content === 'string'... ERROR in ./src/index. css Module build failed (from ./node_modules/ css -loader/dist/cjs.js): Css SyntaxError 问题原因是：style-loader 和 css -loader的顺序写反了，顺序写反就会报 Css SyntaxError 的错误 ERROR in ./src/style. css Module build failed: Css SyntaxError (1:1) Unknown word 一脸懵逼 以前没错啊 可能之前都是复制的 test: /. css $/, use: [ 自定义 打包 目录 npm run dev:custom 开发阶段，如果page目录下页面过多，会导致 打包 缓慢，影响开发效率。可以新建一个customPages.json指定开发阶段需要 打包 的页面 "pages": [ vue watch报错：Error in callback for watcher “xxx“: “TypeError: Cannot read properties of undefined ... 37195 使用 vue cli 的 vue serve命令单独运行.vue文件报错： Error: Cannot find module ‘@vue/compiler-sfc/package.json‘ 14791 vue watch报错：Error in callback for watcher “xxx“: “TypeError: Cannot read properties of undefined ... x15928598057: 哈哈哈哈都快郁闷死了，我也是这个单词拼错了 React中使用Ant Design组件库报错 invalid hook call && 组件无法正常显示 UI匠心: 我还是没有解决引入antd问题？存在bug rush update后报错：Can‘t resolve ‘D:\comen-web-new\common\temp\node_modules\.pnpm\vue-loader@15；安装依赖报错 m0_68234426: 你跟我是一个公司的吗？你的路径里面有公司名。。我也要是rush update时报错，重启好几遍了也没用，你下班没，可以过来帮我弄弄吗 Vue组件数据重置/清空；模态框数据重置问题 半个开心果: 但是，如果我这个selectBox 没有隐藏的情况，他是一直显示的状态呢？又该怎么重置表单，只是有一个重置按钮，我目前是一个一个清空的，有啥更好的方式吗？ 使用GLTFLoader加载.glb文件报错：Uncaught SyntaxError:Unexpected token ‘%‘, “%TSD-Heade“... is not valid JSON 本地代码正常打包编译后有问题——Class.name取到的类名不能当作判断的变量！ mapBox 绘制多边形无法设置 边框宽度 解决方法