vue中vue.config.js
时间: 2023-11-01 15:59:53 浏览: 51
在Vue项目中,vue.config.js是用来配置项目的配置文件。在Vue 2.0版本中,build和config文件夹已经被取消,所以想要配置build生成目录等打包需求,就需要使用vue.config.js。
该文件主要用于设置webpack的配置信息,包括基础配置和各种配置详解。其中一些主要的配置包括publicPath、outputDir、assetsDir、indexPath、filenameHashing、lintOnSave、runtimeCompiler、transpileDependencies、productionSourceMap、crossorigin等。
另外,在vue.config.js中也可以配置Webpack相关信息和Css相关信息,如configureWebpack、chainWebpack、css.requireModuleExtension、css.loaderOptions、css.extract等。
关于npm安装包的--save和--save-dev区别,前者是将安装的包信息添加到package.json的dependencies中,而后者是添加到devDependencies中,devDependencies中的包只是在开发过程中使用,不会被部署到生产环境中。
相关问题
vue2中vue.config.js的配置
在Vue 2中,可以使用vue.config.js文件对项目进行配置。关于vue.config.js的配置方式,有以下几点需要注意:
1. devServer配置方式:可以通过在vue.config.js文件中配置devServer选项来修改开发服务器的配置。可以参考中的示例代码来设置相关配置。
2. css的处理方式:可以通过在vue.config.js文件中的css选项中进行相关配置,例如使用less、scss等预处理器。具体的配置方式可以参考中的示例代码。
3. 内部Webpack配置:Vue CLI会将vue.config.js中的配置与内部Webpack配置合并,从而生成最终的Webpack配置。可以通过在vue.config.js文件中的chainWebpack选项中进行相关配置。例如,可以使用config.resolve.alias来设置别名。具体的配置方式可以参考中的示例代码。
综上所述,以上是Vue 2中vue.config.js的配置方式的相关信息。希望对您有所帮助。
vue中vue.config.js的deServer
`devServer`是Vue CLI中的一个配置选项,用于配置开发服务器。通过修改`vue.config.js`文件中的`devServer`选项,可以对开发服务器进行一些自定义的配置。
下面是一个示例的`vue.config.js`文件,展示了如何配置`devServer`:
```javascript
module.exports = {
devServer: {
port: 8080, // 指定开发服务器的端口号,默认为8080
proxy: {
'/api': {
target: 'http://localhost:3000', // 将所有以 /api 开头的请求代理到指定的地址
changeOrigin: true, // 将主机头的源更改为目标URL
pathRewrite: {
'^/api': '' // 重写请求路径,去掉 /api 前缀
}
}
}
}
}
```
在上面的示例中,我们配置了开发服务器的端口号为8080,并且使用`proxy`选项将以`/api`开头的请求代理到目标地址http://localhost:3000。这样在开发过程中,所有以`/api`开头的请求都会被代理到目标地址,方便与后端进行联调。
还有许多其他的配置选项可以在`devServer`中进行设置,比如`host`、`hot`、`https`等,请根据具体需求进行配置。更详细的配置说明可以参考Vue CLI官方文档。