1.錯(cuò)誤提示:
2.vue 項(xiàng)目目錄
用到了
3.解決方案
新建文件vue.config.js 放在根目錄辙售,參考要點(diǎn)2里面的目錄电抚,vue.config.js的內(nèi)容:
開始:
module.exports = {
? /** 區(qū)分打包環(huán)境與開發(fā)環(huán)境
? * process.env.NODE_ENV==='production'? (打包環(huán)境)
? * process.env.NODE_ENV==='development' (開發(fā)環(huán)境)
? * baseUrl: process.env.NODE_ENV==='production'?"https://cdn.didabisai.com/front/":'front/',
? */
? // 項(xiàng)目部署的基礎(chǔ)路徑
? // 我們默認(rèn)假設(shè)你的應(yīng)用將會(huì)部署在域名的根部,
? // 例如 https://www.my-app.com/
? // 如果你的應(yīng)用部署在一個(gè)子路徑下舌胶,那么你需要在這里
? // 指定子路徑啤咽。比如將你的應(yīng)用部署在
? // https://www.foobar.com/my-app/
? // 那么將這個(gè)值改為 '/my-app/'
? publicPath: "/dist/", // 構(gòu)建好的文件輸出到哪里
? outputDir: "dist", // where to put static assets (js/css/img/font/...) // 是否在保存時(shí)使用‘eslint-loader’進(jìn)行檢查 // 有效值: true | false | 'error' // 當(dāng)設(shè)置為‘error’時(shí),檢查出的錯(cuò)誤會(huì)觸發(fā)編譯失敗
? lintOnSave: true, // 使用帶有瀏覽器內(nèi)編譯器的完整構(gòu)建版本 // https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only
? runtimeCompiler: false, // babel-loader默認(rèn)會(huì)跳過`node_modules`依賴. // 通過這個(gè)選項(xiàng)可以顯示轉(zhuǎn)譯一個(gè)依賴
? transpileDependencies: [
? ? /* string or regex */
? ], // 是否為生產(chǎn)環(huán)境構(gòu)建生成sourceMap?
? productionSourceMap: false, // 調(diào)整內(nèi)部的webpack配置. // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
? chainWebpack: () => {},
? configureWebpack: () => {}, // CSS 相關(guān)選項(xiàng)
? css: {
? ? // 將組件內(nèi)部的css提取到一個(gè)單獨(dú)的css文件(只用在生產(chǎn)環(huán)境)
? ? // 也可以是傳遞給 extract-text-webpack-plugin 的選項(xiàng)對(duì)象
? ? extract: true, // 允許生成 CSS source maps?
? ? sourceMap: false, // pass custom options to pre-processor loaders. e.g. to pass options to // sass-loader, use { sass: { ... } }
? ? loaderOptions: {}, // Enable CSS modules for all css / pre-processor files. // This option does not affect *.vue files.
? ? modules: false
? }, // use thread-loader for babel & TS in production build // enabled by default if the machine has more than 1 cores
? parallel: require("os").cpus().length > 1, // PWA 插件相關(guān)配置 // see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
? pwa: {}, // configure webpack-dev-server behavior
? devServer: {
? ? open: process.platform === "darwin",
? ? disableHostCheck: false,
? ? host: "0.0.0.0",
? ? port: 8088,
? ? https: false,
? ? hotOnly: false, // See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#configuring-proxy
? ? proxy: null // string | Object
? ? // before: app => {}
? }, // 第三方插件配置
? pluginOptions: {
? ? // ...
? }
};
結(jié)束
其中:
????????publicPath: "/dist/", // 構(gòu)建好的文件輸出到哪里? ?
是關(guān)鍵墓卦。
npm run build 之后將dist文件夾(包含index.html,js,css等)放在nginx的html文件夾下即可~
訪問路徑: