在vue脚手架3.0以后项目目录中没有 vue.config.js 文件,需要手动创建配置
创建vue.config.js vue.config.js 是一个可选的配置文件,如果项目的 (和 package.json 同级的) 根目录中存在这个文件,那么它会被 @vue/cli-service 自动加载。你也可以使用 package.json 中的 vue 字段,但是注意这种写法需要你严格遵照 JSON 的格式来写。
在根目录中创建 vue.config.js
文章图片
vue.config.js配置 这个文件里应该导出一个对象:
文章图片
配置选项 publicPath
Type: string部署应用包时的基本 URL, 用法和 webpack 本身的 output.publicPath 一致。
Default:'/'
这个值应该设置为空字符串 ('') 或是相对路径 ('./'),这样所有的资源都会被链接为相对路径,这样打出来的包可以被部署在任意路径。
outputDir
Type:string打包后的文件目录,当运行 vue-cli-service build 时生成的生产环境构建文件的目录。注意目标目录在构建之前会被清除 (构建时传入 --no-clean 可关闭该行为)。
Default:'dist'
assetsDir
Type:string放置生成的静态资源 (js、css、img、fonts) 的目录。笔者习惯设置为 “static”
Default:''
【vue|vue.config.js 配置参考】filenameHashing
Type: boolean默认情况下,生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存。然而,这也要求 index 的 HTML 是被 Vue CLI 自动生成的。如果你无法使用 Vue CLI 生成的 index HTML,你可以通过将这个选项设为 false 来关闭文件名哈希。
Default: true
lintOnSave
Type: boolean | 'error'是否在保存的时候使用 `eslint-loader` 进行检查。 有效的值:`ture` | `false` | `"error"` 当设置为 `"error"` 时,检查出的错误会触发编译失败。
Default: true
productionSourceMap
Type: boolean如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。
Default: true
devServer
Type: Object所有 webpack-dev-server 的选项都支持。注意:有些值像 host、port 和 https 可能会被命令行参数覆写。有些值像 publicPath 和 historyApiFallback 不应该被修改,因为它们需要和开发服务器的 publicPath 同步以保障正常的工作。
devServer.proxy
Type: string | Object跨域配置,其属性有
target 请求的地址 Type: string
changeOrigin 是否跨域 Type: boolean
pathRewrite 路径重写规则 Type: object
文章图片
推荐阅读
- WEB前端线上系统课2022最新coderwhy
- 前端|JS的内存管理
- 笔记|VUE详解
- Vue介绍
- Vue|SpringCloud分布式微服务系统架构搭建
- Java|JAVA常用工具收集总结
- spring|40 个 SpringBoot 常用注解
- vue|vue 简单入门
- vue|springboot+vue3.0+token 安全验证