Javascript 模块构建失败(来自./node\u modules/mini css extract plugin/dist/loader.js):引用错误:未定义文档
好的,所以基本上我们在部署之前使用webpack捆绑我们的资源。然而,现在我们还想通过webpack捆绑我们的sass文件,因为它简化了我们的构建过程。它进行得很顺利,但现在bundle.js太大,无法部署到生产环境中,所以我想拆分bundle.js和样式文件。我对插件和所有插件都不太了解,所以我搜索了一下,发现mini css extract插件允许我将样式文件拆分为一个新文件。因此,我根据的文档调整了web-pack.config文件 迷你css提取插件,但我得到这么多的错误。有人能指导我拆分样式文件并从bundle.js中提取它吗 错误:Javascript 模块构建失败(来自./node\u modules/mini css extract plugin/dist/loader.js):引用错误:未定义文档,javascript,css,reactjs,webpack,sass,Javascript,Css,Reactjs,Webpack,Sass,好的,所以基本上我们在部署之前使用webpack捆绑我们的资源。然而,现在我们还想通过webpack捆绑我们的sass文件,因为它简化了我们的构建过程。它进行得很顺利,但现在bundle.js太大,无法部署到生产环境中,所以我想拆分bundle.js和样式文件。我对插件和所有插件都不太了解,所以我搜索了一下,发现mini css extract插件允许我将样式文件拆分为一个新文件。因此,我根据的文档调整了web-pack.config文件 迷你css提取插件,但我得到这么多的错误。有人能指导我拆
ERROR in ./node_modules/normalize.css/normalize.css
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ReferenceError: document is not defined
at insertStyleElement (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:309:15) at addStyle (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:424:13)
at modulesToDom (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:297:18)
at module.exports.module.exports (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:455:25)
at Object.<anonymous> (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:206:14) at __webpack_require__ (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:21:30) at D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:85:18
at Object.<anonymous> (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\normalize.css\normalize.css:88:10)
at Module._compile (D:\ReactJs-Projects\Expensify-app\node_modules\v8-compile-cache\v8-compile-cache.js:194:30)
at evalModuleCode (D:\ReactJs-Projects\Expensify-app\node_modules\mini-css-extract-plugin\dist\loader.js:61:10)
at D:\ReactJs-Projects\Expensify-app\node_modules\mini-css-extract-plugin\dist\loader.js:166:21
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:343:11
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:681:15
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:678:31
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1423:35
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1414:32
at eval (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:11:1)
at D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\index.js:321:9
at TaskRunner.run (D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\TaskRunner.js:48:7)
at TerserPlugin.optimizeFn (D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\index.js:227:18)
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:7:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1409:36
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1405:32
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at Compilation.seal (D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1342:27)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:675:18
@ ./src/app.js 10:0-37
ERROR in ./node_modules/react-dates/lib/css/_datepicker.css
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ReferenceError: document is not defined
at insertStyleElement (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:309:15)
at addStyle (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:424:13)
at modulesToDom (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:297:18)
at module.exports.module.exports (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:455:25)
at Object.<anonymous> (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:206:14)
at __webpack_require__ (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:21:30)
at D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:85:18
at Object.<anonymous> (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\node_modules\react-dates\lib\css\_datepicker.css:88:10)
at Module._compile (D:\ReactJs-Projects\Expensify-app\node_modules\v8-compile-cache\v8-compile-cache.js:194:30)
at evalModuleCode (D:\ReactJs-Projects\Expensify-app\node_modules\mini-css-extract-plugin\dist\loader.js:61:10)
at D:\ReactJs-Projects\Expensify-app\node_modules\mini-css-extract-plugin\dist\loader.js:166:21
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:343:11
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:681:15
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:678:31
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1423:35
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1414:32
at eval (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:11:1)
at D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\index.js:321:9
at TaskRunner.run (D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\TaskRunner.js:48:7)
at TerserPlugin.optimizeFn (D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\index.js:227:18)
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:7:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1409:36
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1405:32
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at Compilation.seal (D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1342:27)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:675:18
@ ./src/components/ExpenseForm.js 27:0-45
@ ./src/components/AddExpensePage.js
@ ./src/routers/AppRouter.js
@ ./src/app.js
ERROR in ./src/styles/styles.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ReferenceError: document is not defined
at insertStyleElement (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:309:15)
at addStyle (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:424:13)
at modulesToDom (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:297:18)
at module.exports.module.exports (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:455:25)
at Object.<anonymous> (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:206:14)
at __webpack_require__ (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:21:30)
at D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:85:18
at Object.<anonymous> (D:\ReactJs-Projects\Expensify-app\node_modules\style-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\css-loader\dist\cjs.js!D:\ReactJs-Projects\Expensify-app\node_modules\sass-loader\lib\loader.js!D:\ReactJs-Projects\Expensify-app\src\styles\styles.scss:88:10)
at Module._compile (D:\ReactJs-Projects\Expensify-app\node_modules\v8-compile-cache\v8-compile-cache.js:194:30)
at evalModuleCode (D:\ReactJs-Projects\Expensify-app\node_modules\mini-css-extract-plugin\dist\loader.js:61:10)
at D:\ReactJs-Projects\Expensify-app\node_modules\mini-css-extract-plugin\dist\loader.js:166:21
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:343:11
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:681:15
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:678:31
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1423:35
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1414:32
at eval (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:11:1)
at D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\index.js:321:9
at TaskRunner.run (D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\TaskRunner.js:48:7)
at TerserPlugin.optimizeFn (D:\ReactJs-Projects\Expensify-app\node_modules\terser-webpack-plugin\dist\index.js:227:18)
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:7:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1409:36
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1405:32
at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1) at AsyncSeriesHook.lazyCompileHook (D:\ReactJs-Projects\Expensify-app\node_modules\tapable\lib\Hook.js:154:20)
at Compilation.seal (D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compilation.js:1342:27)
at D:\ReactJs-Projects\Expensify-app\node_modules\webpack\lib\Compiler.js:675:18
@ ./src/app.js 11:0-30
package.json:
{
"name": "expensify-app",
"version": "1.0.0",
"main": "index.js",
"author": "Viral Thaker",
"license": "MIT",
"scripts": {
"serve": "live-server public/",
"build:dev": "webpack",
"build:prod": "webpack -p --env production",
"dev-server": "webpack-dev-server",
"start": "npm run dev-server",
"test": "jest"
},
"dependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-loader": "^8.1.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"css-loader": "^4.0.0",
"jest": "^26.4.1",
"live-server": "^1.2.1",
"moment": "^2.27.0",
"node-sass": "^4.14.1",
"normalize.css": "^8.0.1",
"react": "^16.13.1",
"react-addons-shallow-compare": "^15.6.2",
"react-dates": "^21.8.0",
"react-dom": "^16.13.1",
"react-modal": "^3.11.2",
"react-redux": "^7.2.1",
"react-router-dom": "^5.2.0",
"redux": "^4.0.5",
"sass-loader": "^6.0.6",
"style-loader": "^1.2.1",
"uuid": "^8.3.0",
"validator": "^13.1.1"
},
"devDependencies": {
"@babel/core": "^7.10.5",
"@babel/preset-env": "^7.10.4",
"@babel/preset-react": "^7.10.4",
"extract-text-webpack-plugin": "^4.0.0-beta.0",
"mini-css-extract-plugin": "^0.10.0",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"
}
}
好吧,不管怎样,正如卡米洛所说,这个“stye loader”与插件有冲突,但无论如何,由于我正在分离CSS文件,我不需要内联CSS,所以我完全从加载程序中删除了它,错误完全消失了,它给了我一个带有单独CSS文件的新版本
任何人,如果将来遇到同样的问题,请查看您的加载程序是否存在冲突我在基于角度的项目中遇到了这样的问题,我已执行了以下步骤,并且已修复:
我想知道你所有的CSS加载器之间是否存在冲突。我要尝试的第一件事是删除
样式加载器
。
{
"name": "expensify-app",
"version": "1.0.0",
"main": "index.js",
"author": "Viral Thaker",
"license": "MIT",
"scripts": {
"serve": "live-server public/",
"build:dev": "webpack",
"build:prod": "webpack -p --env production",
"dev-server": "webpack-dev-server",
"start": "npm run dev-server",
"test": "jest"
},
"dependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-loader": "^8.1.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"css-loader": "^4.0.0",
"jest": "^26.4.1",
"live-server": "^1.2.1",
"moment": "^2.27.0",
"node-sass": "^4.14.1",
"normalize.css": "^8.0.1",
"react": "^16.13.1",
"react-addons-shallow-compare": "^15.6.2",
"react-dates": "^21.8.0",
"react-dom": "^16.13.1",
"react-modal": "^3.11.2",
"react-redux": "^7.2.1",
"react-router-dom": "^5.2.0",
"redux": "^4.0.5",
"sass-loader": "^6.0.6",
"style-loader": "^1.2.1",
"uuid": "^8.3.0",
"validator": "^13.1.1"
},
"devDependencies": {
"@babel/core": "^7.10.5",
"@babel/preset-env": "^7.10.4",
"@babel/preset-react": "^7.10.4",
"extract-text-webpack-plugin": "^4.0.0-beta.0",
"mini-css-extract-plugin": "^0.10.0",
"webpack": "^4.44.1",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"
}
}