vue-cli3.0.0如何修改babel-loader配置

因为网站使用了vue-cliV3.4.1,导致出现了iphone下报错
Unexpectedkeyword'const'.Constdeclarationsarenotsupportedinstrictmode.
所以参考了https://github.com/mrdulin/bl...
里面说明需要降价webpack-dev-server或者修改babel-loader的配置
于是去vue-cli
官网查看,需要操作webpack-chain插件
按照webpack-chain文档提供的方法修改了vue.config.js的文件
varpath=require('path');
module.exports={
productionSourceMap:false,
publicPath:process.env.NODE_ENV==='production'?
'/':'/',
chainWebpack:config=>{
config.resolve.alias
.set('@',path.resolve('src'))
.set('_c',path.resolve('src/components'))
.set('_conf',path.resolve('config'))
config.module.rule('compile')
.test(/\.js$/)
.include
.add('src')
.add('/node_modules/')
.end()
.use('babel')
.loader('babel-loader')
.options({
presets:[
['@babel/preset-env',{
modules:false
}]
]
});
},
css:{
loaderOptions:{
stylus:{
'resolveurl':true,
'import':[]
}
}
},
pluginOptions:{
'cube-ui':{
postCompile:true,
theme:false
}
}
}
然后进行编译,报错如下
WebpackOptionsValidationError:Invalidconfigurationobject.Webpackhasbeeninitialisedusingaconfiguration
objectthatdoesnotmatchtheAPIschema.
-configuration.module.rules[13].includeshouldbeoneofthese:
RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}|[RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}]
->Oneormultipleruleconditions
Details:
*configuration.module.rules[13].includeshouldbeaninstanceofRegExp
*configuration.module.rules[13].includeshouldbeastring.
*configuration.module.rules[13].includeshouldbeaninstanceoffunction
*configuration.module.rules[13].include[0]shouldbeaninstanceofRegExp
*configuration.module.rules[13].include[0]:Theprovidedvalue"src"isnotanabsolutepath!
*configuration.module.rules[13].include[0]shouldbeaninstanceoffunction
*configuration.module.rules[13].include[0]shouldbeanarray:
[RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}]
*configuration.module.rules[13].include[0]shouldbeanobject.
*configuration.module.rules[13].includeshouldbeanobject.
*configuration.module.rules[13].include[0]shouldbeaninstanceofRegExp
*configuration.module.rules[13].include[0]:Theprovidedvalue"src"isnotanabsolutepath!
*configuration.module.rules[13].include[0]shouldbeaninstanceoffunction
*configuration.module.rules[13].include[0]shouldbeanarray:
[RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}]
*configuration.module.rules[13].include[0]shouldbeanobject.
WebpackOptionsValidationError:Invalidconfigurationobject.WebpackhasbeeninitialisedusingaconfigurationobjectthatdoesnotmatchtheAPIschema.
-configuration.module.rules[13].includeshouldbeoneofthese:
RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}|[RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}]
->Oneormultipleruleconditions
Details:
*configuration.module.rules[13].includeshouldbeaninstanceofRegExp
*configuration.module.rules[13].includeshouldbeastring.
*configuration.module.rules[13].includeshouldbeaninstanceoffunction
*configuration.module.rules[13].include[0]shouldbeaninstanceofRegExp
*configuration.module.rules[13].include[0]:Theprovidedvalue"src"isnotanabsolutepath!
*configuration.module.rules[13].include[0]shouldbeaninstanceoffunction
*configuration.module.rules[13].include[0]shouldbeanarray:
[RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}]
*configuration.module.rules[13].include[0]shouldbeanobject.
*configuration.module.rules[13].includeshouldbeanobject.
*configuration.module.rules[13].include[0]shouldbeaninstanceofRegExp
*configuration.module.rules[13].include[0]:Theprovidedvalue"src"isnotanabsolutepath!
*configuration.module.rules[13].include[0]shouldbeaninstanceoffunction
*configuration.module.rules[13].include[0]shouldbeanarray:
[RegExp|string|function|[(recursive)]|object{and?,exclude?,include?,not?,or?,test?}]
*configuration.module.rules[13].include[0]shouldbeanobject.
atwebpack(D:\github.com\JavaScript\wawp\node_modules\webpack\lib\webpack.js:31:9)
atPromise(D:\github.com\JavaScript\wawp\node_modules\@vue\cli-service\lib\commands\build\index.js:192:5)
atnewPromise()
atbuild(D:\github.com\JavaScript\wawp\node_modules\@vue\cli-service\lib\commands\build\index.js:191:10)
errorCommandfailedwithexitcode1.
infoVisithttps://yarnpkg.com/en/docs/cli/runfordocumentationaboutthiscommand.
请教大神有没有知道这该如何解决的???
慕哥9229398
浏览 6518回答 2
2回答

湖上湖

经过测试发现是swiper包中的swiper.esm.bundle.js是没有经过babel转换的,所以我在未找到更合适的办法前,将这个文件剔除了

呼啦一阵风

constpath=require('path')functionresolve(dir){returnpath.join(__dirname,'..',dir)}....test(/\.js$/).include.add(resolve('src'))
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript