在項(xiàng)目的根目錄下面疑苔，創(chuàng)建vue.config.js文件份企，具體模板如下：

vue.config.js 代碼：

module.exports = {
? // 部署應(yīng)用時(shí)的基本URL.
baseUrl: process.env.NODE_ENV === 'production' ? '192.168.60.110:8080' : '192.168.60.110:8080',
// build時(shí)構(gòu)建文件的目錄,構(gòu)建時(shí)傳入 --no-clean 可關(guān)閉該行為.
outputDir: 'dist',
?// build時(shí)放置生成的靜態(tài)資源(js蒲牧、css撇贺、img、fonts)的(相對(duì)于 outputDir 的)目錄.
assetsDir: '',
// 指定生成的index.html的輸出路徑(相對(duì)于 outputDir),也可以是一個(gè)絕對(duì)路徑.
indexPath: 'index.html',
// 默認(rèn)在生成的靜態(tài)資源文件名中包含hash以控制緩存.
filenameHashing: true,
// 構(gòu)建多頁(yè)面應(yīng)用,頁(yè)面的配置.
// pages: {
//? index: {
//? ? // page的入口.
?//? ? entry: 'src/index/main.js',
//? ? // 模板來源.
//? ? template: 'public/index.html',
//? ? // 在dist/index.html的輸出.
//? ? filename: 'index.html',
//? ? // 當(dāng)使用title選項(xiàng)時(shí),template中的title標(biāo)簽需要是<title><%= htmlWebpackPlugin.options.title %></title>.
//? ? title: 'Index Page',
//? ? // 在這個(gè)頁(yè)面中包含的塊冰抢，默認(rèn)情況下會(huì)包含.
//? ? // 提取出來的通用 chunk 和 vendor chunk.
//? ? chunks: ['chunk-vendors', 'chunk-common', 'index']
//? },
//? // 當(dāng)使用只有入口的字符串格式時(shí),模板會(huì)被推導(dǎo)為`public/subpage.html`,并且如果找不到的話,就回退到 `public/index.html`.
//? // 輸出文件名會(huì)被推導(dǎo)為`subpage.html`.
//? subpage: 'src/subpage/main.js'
// },
// 是否在開發(fā)環(huán)境下通過eslint-loader在每次保存時(shí)lint代碼(在生產(chǎn)構(gòu)建時(shí)禁用 eslint-loader).
lintOnSave: process.env.NODE_ENV !== 'production',
// 是否使用包含運(yùn)行時(shí)編譯器的Vue構(gòu)建版本.
runtimeCompiler: false,
// Babel顯式轉(zhuǎn)譯列表.
transpileDependencies: [],
// 如果你不需要生產(chǎn)環(huán)境的source map,可以將其設(shè)置為 false 以加速生產(chǎn)環(huán)境構(gòu)建.
productionSourceMap: true,
// 設(shè)置生成的HTML中<link rel="stylesheet">和<script>標(biāo)簽的crossorigin屬性(注:僅影響構(gòu)建時(shí)注入的標(biāo)簽).
crossorigin: '',
// 在生成的HTML中的<link rel="stylesheet">和<script>標(biāo)簽上啟用Subresource Integrity(SRI).
integrity: false,
// 如果這個(gè)值是一個(gè)對(duì)象,則會(huì)通過 webpack-merge 合并到最終的配置中.
// 如果你需要基于環(huán)境有條件地配置行為,或者想要直接修改配置,那就換成一個(gè)函數(shù)(該函數(shù)會(huì)在環(huán)境變量被設(shè)置之后懶執(zhí)行).該方法的第一個(gè)參數(shù)會(huì)收到已經(jīng)解析好的配置.在函數(shù)內(nèi),你可以直接修改配置,或者返回一個(gè)將會(huì)被合并的對(duì)象.
configureWebpack: {},
// 對(duì)內(nèi)部的webpack配置(比如修改松嘶、增加Loader選項(xiàng))(鏈?zhǔn)讲僮?.
chainWebpack: () => { },
// css的處理.
?css: {
// 當(dāng)為true時(shí),css文件名可省略module默認(rèn)為false.
modules: true,
// 是否將組件中的CSS提取至一個(gè)獨(dú)立的CSS文件中,當(dāng)作為一個(gè)庫(kù)構(gòu)建時(shí),你也可以將其設(shè)置為false免得用戶自己導(dǎo)入CSS
// 默認(rèn)生產(chǎn)環(huán)境下是true,開發(fā)環(huán)境下是false.
extract: false,
// 是否為CSS開啟source map.設(shè)置為true之后可能會(huì)影響構(gòu)建的性能.
sourceMap: false,
// 向CSS相關(guān)的loader傳遞選項(xiàng)(支持:css-loader postcss-loader sass-loader less-loader stylus-loader).
loaderOptions: { css: {}, less: {} }
},
// 所有webpack-dev-server的選項(xiàng)都支持.
devServer: {},
// 是否為Babel或TypeScript使用thread-loader.
parallel: require('os').cpus().length > 1,
// 向PWA插件傳遞選項(xiàng).
pwa: {},
// 可以用來傳遞任何第三方插件選項(xiàng).
pluginOptions: {}
}

上述圖片中 pages 配置為多頁(yè)面應(yīng)用的 頁(yè)面配置，如果是單頁(yè)面可注釋掉

網(wǎng)上查詢學(xué)習(xí)總結(jié)