初入Vue（二）-vue.config.js

前言

已下基于 Vue3.x 版本

vue.config.js 是一个配置文件，存在与项目的根目录中。他会被 @vue/cli-service 自动加载。

创建一个新项目，会有如下空配置：

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
})

该文件应该导出一个包含了选项的对象

配置解读

1. baseUrl

从 Vue CLI 3.3 起已弃用，现在都使用 publicPath

1. publicPath

默认值：'/'

是部署应用包时的基本 URL，在 Vue CLI的其他地方也会使用这个值，默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上，例如 https://www.qjdchina.com/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.qjdchina.com/h5/，则设置 publicPath 为 /h5/。

这个值也可以被设置为空字符串 ('') 或是相对路径 ('./')，这样所有的资源都会被链接为相对路径，这样打出来的包可以被部署在任意路径。

像目前我们 风险专家 app，里面的评估详情，就区分出了不同环境的不同根路径，使用一个条件式的值：

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  publicPath: process.env.NODE_ENV === "production" ? "/h5/" : "/"
})

1. outputDir

默认值: dist

build 生成的生产环境构建文件目录，可以是静态路径，也可以是相对路径，在 build 后传入 --no-clean 可关闭默认的构建前自动清除功能。默认如下：

module.exports = {
  publicPath: './', // 基本路径
  outputDir: 'dist', // 输出文件目录
}

1. assetsDir

build 生成的生产环境的静态资源文件夹，包括 js、css、img、fonts ，默认如下：

module.exports = {
  publicPath: './', // 基本路径
  outputDir: 'dist', // 输出文件目录
  asset