我正在将react集成到Django中,下面是我得到的错误。
ERROR in ./backend/frontend/src/App.css 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> .App {
| text-align: center;
| }
@ ./backend/frontend/src/App.js 2:0-19
@ ./backend/frontend/src/index.js 4:0-24 6:107-110
我的webpack.config.js
module.exports = {
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: "babel-loader",
},
{
test: /.scss$/,
use: ['style-loader', 'css-loader', 'sass-loader'],
},
]
}
};
这是我的包裹。json依赖性
"devDependencies": {
"@babel/core": "^7.15.5",
"@babel/preset-env": "^7.15.6",
"@babel/preset-react": "^7.14.5",
"babel-loader": "^8.2.2",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"webpack": "^5.55.0",
"webpack-cli": "^4.8.0"
}
有人能建议如何解决这个问题吗?由于
<解决方案/strong>
原来我漏掉了很多东西,以下是我所做的:
npm i react react-dom --save-dev
npm install -D style-loader css-loader sass-loader
npm install --save axios
npm install --save react-router-dom
npm install --save react-dropzone
npm install react-bootstrap@next bootstrap@5.1.1
npm i web-vitals --save-dev
npm install url-loader --save-dev
npm install file-loader --save-dev
然后根据上面的答案更新我的webpack.config.js
。
除非您的package.json
已经在dependencies
下包含它们,否则请安装缺失的加载器:
npm install -D style-loader css-loader sass-loader
在你的webpack配置中添加一个新规则来针对css
文件:
module.exports = {
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: "babel-loader",
},
{
test: /.scss$/,
use: ['style-loader', 'css-loader', 'sass-loader'],
},
{
test: /.css$/,
use: ['style-loader', 'css-loader']
}
]
}
};