如何解决将Bootstrap纳入Webpack配置时出现错误
我目前正在尝试将Bootstrap合并到使用Webpack的React项目中。我已经解决了几个问题,试图使Webpack设置为使用Bootstrap,但目前无法解决此问题。我已经尝试过寻找答案,但是还没有提出任何答案。我什至遵循了BootStrap文档,但这没有用。当我去编译我的JSX时,控制台中出现以下错误。
ERROR in ./node_modules/bootstrap/dist/css/bootstrap.min.css
Module build failed (from ./node_modules/style-loader/dist/cjs.js):
ValidationError: Invalid options object. Style Loader has been initialized using an options object that does not match the API schema.
- options should be an object:
object { injectType?,attributes?,insert?,base?,esModule? }
at validate (/home/game-app/node_modules/schema-utils/dist/validate.js:98:11)
at Object.loader (/home/game-app/node_modules/style-loader/dist/index.js:25:28)
@ ./src/index.jsx 4:0-46
我认为我已经很接近设置它了,但是Webpack不喜欢它如何提供引导数据。在这个问题上的任何帮助将不胜感激。如有必要,我也可以提供我的webpack.config文件。
谢谢!
编辑:
Webpack配置
const HtmlWebPackPlugin = require('html-webpack-plugin');
const path = require('path');
const htmlPlugin = new HtmlWebPackPlugin({
template: './src/index.html',filename: './index.html',});
module.exports = {
entry: './src/index.jsx',output: { // NEW
path: path.join(__dirname,'dist'),filename: '[name].js',},// NEW Ends
plugins: [htmlPlugin],module: {
rules: [
{
test: /\.(js|jsx)$/,exclude: /node_modules/,use: {
loader: 'babel-loader',{
test: /\.css$/,use: ['style-loader','css-loader'],],resolve: {
extensions: ['.js','.jsx'],};
edit2:
.babelrc
{
"presets": ["@babel/preset-env","@babel/preset-react"]
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。