以上方法中,webapack.config.js中的配置,如何在vue.config.js中配置
时间: 2024-05-16 08:17:50 浏览: 83
在 `vue.config.js` 中配置 `webpack` 的方式是使用 `configureWebpack` 或 `chainWebpack` 选项。
使用 `configureWebpack` 选项,可以直接修改 webpack 配置对象。
例如,在 `vue.config.js` 中添加以下代码:
```javascript
module.exports = {
configureWebpack: {
plugins: [
new MyWebpackPlugin()
]
}
}
```
这将添加一个自定义的 webpack 插件 `MyWebpackPlugin` 到 webpack 配置中。
另一方面,使用 `chainWebpack` 选项,可以通过链式调用方式修改 webpack 配置。
例如,在 `vue.config.js` 中添加以下代码:
```javascript
module.exports = {
chainWebpack: config => {
config.plugin('my-plugin')
.use(MyWebpackPlugin)
}
}
```
这将使用 `MyWebpackPlugin` 插件来修改 webpack 配置。
需要注意的是,`chainWebpack` 和 `configureWebpack` 选项是互斥的,也就是说,如果同时使用了这两个选项,`configureWebpack` 选项会覆盖 `chainWebpack` 选项。
相关问题
vue2中没有VUE.Config.js,该怎么配置Vue.config.js?
在Vue 2中,可以通过在main.js文件中添加以下代码来配置Vue:
```
Vue.config.optionMergeStrategies.myCustomOption = function(toVal, fromVal) {
return toVal || fromVal
}
Vue.config.devtools = true
Vue.config.productionTip = false
```
其中,myCustomOption是自定义的配置选项,devtools选项用于开启chrome/vue-devtools的调试工具,productionTip选项用于屏蔽生产环境的提示。
vue2中没有VUE.Config.js,该怎么配置Vue.config.js 的 chainWebpack
在Vue2中,你可以通过在项目根目录下的`vue.config.js`文件中进行配置。如果你想要配置`chainWebpack`,你可以按照以下方式进行:
```javascript
module.exports = {
chainWebpack: config => {
// 在这里添加你的Webpack配置
}
}
```
你可以在`config`对象上使用Webpack提供的所有配置项。例如,如果你想要添加一个新的loader,你可以使用以下代码:
```javascript
module.exports = {
chainWebpack: config => {
config.module
.rule('my-rule')
.test(/\.my-extension$/)
.use('my-loader')
.loader('my-loader')
.end()
}
}
```
这将向Webpack添加一个新的规则,当遇到`.my-extension`的文件时,将使用`my-loader`进行处理。
阅读全文