webpack打包报错记录

最新推荐文章于 2022-11-23 16:48:38 发布
最新推荐文章于 2022-11-23 16:48:38 发布
阅读量888 收藏 4
点赞数 3
分类专栏： webpack 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42309685/article/details/119957465
版权
在进行Webpack打包时遇到配置错误，提示'configuration.module.rules[2]'不匹配API schema。问题在于rules中的loader应为非空字符串。解决方案是将配置中的 全部改为 ，这是因为不同Webpack版本间的差异。修复此问题后，可以正常进行打包。
摘要由CSDN通过智能技术生成

Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
configuration.module.rules[2] should be one of these:
["…" | object { assert?, compiler?, dependency?, descriptionData?, enforce?, exclude?, generator?, include?, issuer?, issuerLayer?, layer?, loader?, mimetype?, oneOf?, options?, parser?, realResource?, resolve?, resource?, resourceFragment?, resourceQuery?, rules?, scheme?, sideEffects?, test?, type?, use? }, …]
-> A rule.
Details:
* configuration.module.rules[2].loader should be a non-empty string.
-> A loader request.

在这里插入图片描述

webpack打包出错，配置如图：

在这里插入图片描述

将 loader 全部改为 use 即可，webpack 版本导致，我安装的是 5+

ikun不解释
关注
  • 3
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决vue build打包之后首页白屏的问题
08-27
- 监控日志：在生产环境中开启Vue的错误追踪和日志记录，以便更快定位问题。 综上所述，解决Vue build打包后首页白屏的问题主要涉及调整静态资源的路径配置。同时，理解其他可能的原因和采取相应的优化措施，将有...
webpack报错：configuration.module.rules[0].loader should be a non-empty string.-＞ A loader request.
qq_44019660的博客
06-12 1766
webpack报错less-loader：configuration.module.rules[0].loader should be a non-empty string.-> A loader request.
webpack之输出(Output)
热门推荐
汉堡请不要欺负面条
09-08 1万+
输出(Output):配置 output 选项可以控制 webpack 如何向硬盘写入编译文件。注意，即使可以存在多个入口起点，但只指定一个输出配置。 一.用法 a.filename 用于输出文件的文件名。b.目标输出目录 path 的绝对路径。 webpack.config.js: const config = { output: { filename: 'bund
webpack配置
weixin_55333190的博客
02-06 693
webpack.config.js属性 module.exports={ entry:"./index.js",//入口，从哪里开始编译 //出口 output:{ publicPath:"",//打包后的文件资源引入到html模板时文件名的前缀 path:"",//打包后到哪里 filename:"builder.js"//打包后生成的文件名 }, plugins:[ 插件 ] } 插件Plugin: `htmlWebpackPlugin`打包后
webpack babel报错问题
Dj_Fairy的博客
11-23 701
解决方法，将module下面的rules下面的loader改成。
webpack打包时提示Invalid configuration object错误
qq_45706352的博客
04-20 1930
报错内容如下： 一开始出现这个错误百度的时候，说是由于配置版本和webpack版本不匹配，于是尝试降低版本，然而并没有用。 于是耐心看了一下提示configuration.module.rules[1] should be one of these……难不成是配置项写错了，可是我都是根据官方文档复制过来的呀。但还是尝试改一下。 //loder配置 module:{ rules:[ { test: /\.css$/i,
9102年webpack4搭建vue项目的方法步骤
10-17
在HTML中引入`main.build.js`，这是webpack打包后的文件： ```html <!DOCTYPE html> , initial-scale=1.0"> <title>Document <script src="/dist/main.build.js"></script> ``` **三、启动...
webpack-play:学会 webpack 从零到一系列
05-01
系列文章优化配置webpack 优化配置之 Tree-shakingwebpack 优化配置之 sideEffectswebpack 优化配置之 Code Splitting 多入口打包webpack 优化配置之 Code Splitting 动态导入以此仓库记录 webpack 的使用与原理...
babel7.x和webpack4.x配置vue项目的方法步骤
11-28
按照之前运行非常流畅的配置走一遍，打包遇到各种坑。只好根据命令行的报错逐个排查，发现babel升级了一个大版本，已经到7.x了。看来每日沉迷项目，已经跟不上节奏了。这里记录一下遇到的问题以及解决方案。 1....
splayerx:SPlayerX @ 2018
04-29
开发中使用 webpack，运行 npm run dev 修改代码后可以同步至表现层，hot reload，不用重新启动。使用 eslint 控制代码质量，不满足标准的代码无法通过编译并会报错。每次版本提交会通过 travis-ci 和 appveyor 自动...
webpack打包原理和相关配置的学习
dwz100916007的博客
05-09 1016
做前端不仅要会开发,还要学会如何打包,尤其是学习vue的时候,使用vue-cli创建项目时,最应该要了解的就是webpack的打包机制和配置了
Js |webpack 使用loader时候 module里面存在loaders的版本问题！！
GC怪兽的Blog
02-08 3068
webpack.config.js module.exports = { entry: "./index.js", output: { path: __dirname, filename: "bundle.js" }, module: { loaders: [ { test: /\.css$/,...
react项目中在webpack配置sass
skybulex的博客
07-13 1187
Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema. - configuration.module.rules[1].oneOf[10] has an unknown property 'loaders'. These properties are valid: object { assert?, compi
webpack v2升级踩坑笔记
weixin_33939380的博客
07-14 560
从Grunt->gulp->webpack,再到目前当红明星rollup，前端模块打包技术日新月异，webpack在今年1月份和6月份左右接连更新了v2和v3版本,为了减少冗余模块，缩减bundle文件大小，webpack v2中也加入了tree-shacking,关于tree-shacking的特征，可以查看知乎如何评价 W...
webpack 配置注意的小技巧 和 坑
进击的程序猿
09-12 1079
webpack 配置注意的小技巧 和 坑 // 相关版本信息 "webpack": "^4.44.1", "webpack-cli": "^3.3.12" css-loader 中的坑 自 v1.0.0 开始废弃了 minimize option，因此无法由如下的写法 v1.0.0 break changes // ... 省略其余配置内容 module:{ rules:[ // "css-loader?minimize", error { test: /\.css$/,
oracle的多个exclude,为什么加了exclude之后就报了很多错误呢？
weixin_35838394的博客
04-03 527
源自：4-2 使用 babel-loader 转换 ES6 代码(上)为什么加了exclude之后就报了很多错误呢？为什么加了exclude之后就报了很多错误呢？这样写： exclude:__dirname+'/node_modules/',这样写： exclude:'./node_modules/',这样写： exclude:__dirname+/node_modules/,这样写： e...
webpack报错1:configuration.mode should be one of these: "development" | "production" | "none"
furfur-jiang的博客
10-26 3045
解决1： 报错如下 × ｢wds｣: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. - configuration.mode should be one of these: ...
vue-cli多页面应用常遇到的问题
weixin_30904593的博客
07-09 686
1、TypeError: webpack.optimize.OccurenceOrderPlugin is not a constructor 此问题出现在webpack 3中，解决办法很简单，将occurenceOrderPlugin改为OccurrenceOrderPlugin即可。 2、ReferenceError: rm is not defined 在build.js中，引入： ...
webpack启动报错
最新发布
04-04
Webpack启动报错可能是由于以下原因导致的： 1. 依赖的模块未安装：在package.json文件中检查是否有未安装的依赖，可以通过运行npm install命令来解决。 2. 配置文件错误：检查webpack配置文件中是否存在语法错误或配置错误，可以通过运行webpack --config webpack.config.js命令来检查错误。 3. 入口文件错误：检查webpack配置文件中是否指定了正确的入口文件路径，确保路径正确且文件存在。 4. Node.js版本问题：检查Node.js版本是否过低或过高，建议使用Node.js v6或v8版本。 5. 插件版本问题：检查webpack插件版本是否与webpack版本兼容，如果不兼容可能会导致启动报错。 6. 其他问题：如果以上方法都无法解决问题，可以尝试重新安装webpack和相关依赖，或者查看具体的错误提示信息来解决问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值