Vue打包后,访问路径可配置

首先,在static下,创建config.json文件
config.json代码如下:
//config.json
 {
    "BASE_URL": "http://localhost:8087"
}
    

然后在main.js中,加入如下代码:

let startApp = function () {
  axios.get('./static/config.json').then((res) => {
   Vue.prototype.BASE_URL = res.data.BASE_URL;//将BASE_URL挂载在Vue原型
    new Vue({
      el: '#app',
      router,
      store,
      components: { App },
      template: '',
    })
  })
}
 
startApp()

同时修改config目录下的index.js文件中的如下内容:

 build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/'+ projectName +'/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist/' + projectName),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',

    /**
     * Source Maps
     */

    productionSourceMap: false,
    // https://webpack.js.org/configuration/devtool/#production
    devtool: '#source-map',
     // Gzip off by default as many popular static hosts such as
    // Surge or Netlify already gzip all static assets for you.
    // Before setting to `true`, make sure to:
    // npm install --save-dev compression-webpack-plugin
    productionGzip: false,
    productionGzipExtensions: ['js', 'css'],

    // Run the build command with an extra argument to
    // View the bundle analyzer report after build finishes:
    // `npm run build --report`
    // Set to `true` or `false` to always turn it on or off
    bundleAnalyzerReport: process.env.npm_config_report
}

你可能感兴趣的:(Vue打包后,访问路径可配置)