执行npm run build的时候报错怎么办?
[webpack-cli] Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.configuration.output has an unknown property ‘publiscPath’.
当我们执行npm run build的时候出现以下错误,说明打包不成功。
我们只需要看前面的这两行,意思大概是无法配置对象。Webpack的初始化使用了不匹配的配置对象API模式。配置有一个未知的属性“publiscPath”。
[webpack-cli] Invalid configuration object. Webpack has been initialized using schema.
- configuration.output has an unknown property 'publiscPath'. These properties
object { assetModuleFilename?, asyncChunks?, auxiliaryComment?, charset?, chnkLoading?, chunkLoadingGlobal?,
clean?, compareBeforeEmit?, crossOriginLoading?, cssChunkFilename?, cssFilenameModuleFilenameTemplate?, devtoolNamespace?, enabledChunkLoadingTypes?, enabledLt?, filename?, globalObject?, hashDigest?, hashDigestLength?, hash
Function?, hashSalt?, hotUpdateChunkFilename?, hotUpdateGlobal?, hotUpdateMainFme?, library?, libraryExport?, libraryTarget?, module?, path?, pathinfo?, publifix?, strictModuleErrorHandling?, strictModuleExceptionHandling?,
trustedTypes?, umdNamedDefine?, uniqueName?, wasmLoading?, webassemblyModuleFil -> Options affecting the output of the compe the compiled files to disk.
1.先检查是否下载好webpack模块,没有下载好的先装好,是不是有漏装的
cnpm install webpack webpack-cli html-webpack-plugin webpack-dev-server -D
2.检查配置生产环境 webpack.prod.js
找到publiscPath,看看为什么没配置对
仔细一看!!!原来是单词没拼写对!
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
// 入口
entry:path.resolve(__dirname,"../src/index.js"),
// 出口
output:{
// 打包后的文件名
filename:"js/app.bundle.js",
// 打包的输出目录
path:path.resolve(__dirname,"../build"),
// 会将上次打包的内容进行清理
clean:true,
// 指定引入文件的地址前缀
publiscPath:"/"
},
// 插件配置
plugins:[
new HtmlWebpackPlugin({
// 指定模板文件
template:path.resolve(__dirname,"../public/index.html"),
// 为引入的JS增加版本HASH
hash:true,
// 将JS放置在body尾部
inject:"body",
// 压缩HTML
minify:{
// 去除注释
removeComments:true,
// 去除双引号
removeAttributeQuotes:true,
// 去除空格换行
collapseWhitespace:true
}
})
],
// 指定模式为生产模式
mode:"production"
}
解决办法:改过来就好啦~
// 指定引入文件的地址前缀
publicPath:"/"
还有很多小伙伴在打包的时候还会出现其他的问题,比如:
vscode会自动联想!!!将plugins误写成Plugin,就会报错。修改过来即可