Vue Cli 3生成的項目結(jié)構(gòu)铡恕,沒有build煮嫌、config目錄,而是使用vue.config.js來進行配置碗暗。
vue.config.js是一個可選的配置文件颈将,如果項目的 (和package.json同級的) 根目錄中存在這個文件,那么它會被@vue/cli-service自動加載言疗。
你也可以使用package.json中的vue字段吆鹤,但是注意這種寫法需要你嚴格遵照 JSON 的格式來寫。
一 查看Vue Cli版本
vue --version 3.5.1
二 創(chuàng)建vue.config.js配置文件
module.exports = {
? // baseUrl從 Vue CLI 3.3 起已棄用洲守,請使用publicPath// 默認情況下疑务,Vue CLI 會假設(shè)你的應(yīng)用是被部署在一個域名的根路徑上,例如 https://www.my-app.com/梗醇。// 如果應(yīng)用被部署在一個子路徑上知允,你就需要用這個選項指定這個子路徑。例如叙谨,如果你的應(yīng)用被部署在 https://www.my-app.com/my-app/温鸽,則設(shè)置 publicPath 為 /my-app/。? publicPath:
? ? process.env.NODE_ENV === "production" ? "/production-sub-path/" : "/",
? // 當運行 vue-cli-service build 時生成的生產(chǎn)環(huán)境構(gòu)建文件的目錄手负。// 注意目標目錄在構(gòu)建之前會被清除 (構(gòu)建時傳入 --no-clean 可關(guān)閉該行為)涤垫。// 默認值'dist'outputDir: "my-app",
? // 放置生成的靜態(tài)資源 (js、css竟终、img蝠猬、fonts) 的目錄(相對于outputDir目錄)。// 默認值''assetsDir: "assets",
? //指定生成的 index.html 的輸出路徑 (相對于 outputDir)统捶。也可以是一個絕對路徑榆芦。// 默認值'index.html'indexPath: "myIndex.html",
? // 默認情況下柄粹,生成的靜態(tài)資源在它們的文件名中包含了 hash 以便更好的控制緩存。filenameHashing:false,
? // 是否在開發(fā)環(huán)境下通過 eslint-loader 在每次保存時 lint 代碼匆绣。這個值會在 @vue/cli-plugin-eslint 被安裝之后生效驻右。lintOnSave: process.env.NODE_ENV !== "production",
? //是否使用包含運行時編譯器的 Vue 構(gòu)建版本。設(shè)置為 true 后你就可以在 Vue 組件中使用 template 選項了崎淳,但是這會讓你的應(yīng)用額外增加 10kb 左右堪夭。runtimeCompiler:false,
? // 如果你不需要生產(chǎn)環(huán)境的 source map,可以將其設(shè)置為 false 以加速生產(chǎn)環(huán)境構(gòu)建拣凹。productionSourceMap:false,
? // 所有 webpack-dev-server 的選項都支持森爽。? devServer: {
? ? host: "localhost",
? ? port: 8080,// 端口號https:false,
? ? open: true,//配置自動啟動瀏覽器// 配置多個代理? ? proxy: {
? ? ? "/api": {
? ? ? ? target: "http://localhost:3000",// 本地模擬數(shù)據(jù)服務(wù)器changeOrigin:true,
? ? ? ? pathRewrite: {
? ? ? ? ? "^/api": ""http:// 去掉接口地址中的api字符串? ? ? ? }
? ? ? },
? ? ? "/foo": {
? ? ? ? target: "http://localhost:8080",// 本地模擬數(shù)據(jù)服務(wù)器changeOrigin:true,
? ? ? ? pathRewrite: {
? ? ? ? ? "^/foo": ""http:// 去掉接口地址中的foo字符串? ? ? ? }
? ? ? }
? ? }
? }
};