Skip to content

Latest commit

 

History

History
90 lines (75 loc) · 2.23 KB

test.md

File metadata and controls

90 lines (75 loc) · 2.23 KB
  1.通过给package.json中cross-env来添加不同的环境变量
  {
  	 ...
      "scripts": {
        "serve": "cross-env BUILD_ENV=dev vue-cli-service serve",
        "build": "cross-env BUILD_ENV=prod vue-cli-service build",
        "buildTest": "cross-env BUILD_ENV=test vue-cli-service build",
        "lint": "vue-cli-service lint",
        "start": "npm run serve"
    },
    ...
  }
  
  2.vue.config.js:通过在此文件中添加自定义环境变量
  
  module.exports = {
    lintOnSave: false,
    css: {
        loaderOptions: {
            sass: {
                // 全局注入sass变量、函数、混合, 第一个@符号是css关键字, 第二个@符号代表src文件夹, 不可缺少分号(;)
                data: `@import '@/css/_vw_func.scss';`
            }
        }
    },
    chainWebpack: config => {
        config.module
            .rule('vue')
            .test(/\.vue$/)
            .use('style-vw-loader')
            .loader('style-vw-loader');
        config.plugin('define').tap(args => {
            args[0]['process.env'].BUILD_ENV = JSON.stringify(process.env.BUILD_ENV);
            return args;
        });
    }
};


  
  3.http.js:在此文件中通过上面的自定义环境变量加载不同的文件
  
  const buildConfig = require('../build/' + process.env.BUILD_ENV + '.js');
  url = buildConfig.BASE_URL + url;

  4.router.js:添加路由的基地址
  
  const router = new Router({
    mode: 'history',
    scrollBehavior: () => ({ y: 0 }),
    base: process.env.BASE_URL,
    routes,
});



├── src
│   ├── App.vue
│   ├── assets
│   │   ├── css
│   │   ├── images
│   │   └── theme-img
│   ├── build
│   │   ├── dev.js
│   │   ├── prod.js
│   │   └── test.js
│   ├── 

其中build下dev.js文件代码:
module.exports = {
    BASE_URL: 'https://test.365msmk.com',
    //BASE_URL: 'https://test.365msmk.com'
};


跨域代理配置:
  devServer : {
        proxy: {
            '/api' : {
                target: 'url',
                changeOrigin: true,
                pathRewrite: {
                    '^/api' : ''
                }
            }
        }
    }