1.package.json
{ "Name": "Element-starter", "description": "A vue.js Project", "Author": "[email protected]", "Private":true, "Scripts": { "Dev:test": "Cross-env target=test webpack-dev-server--inline--hot--env.dev", "Dev:prod": "Cross-env target=prod webpack-dev-server--inline--hot--env.dev", "Build:test": "Cross-env target=test Rimraf Dist && webpack-p--progress--hide-modules", "Build:prod": "Cross-env target=prod Rimraf Dist && webpack-p--progress--hide-modules", "Start": "Ws-z-D Dist" }, "Dependencies": { "Axios": "^0.18.0", "Cross-env": "^5.2.0", "Element-ui": "^2.3.4", "Local-web-server": "^2.6.0", "Moment": "^2.22.2", "Vue": "^2.5.16", "VUE-QR": "^1.5.2", "Vue-router": "^3.0.1" }, "Engines": { "Node": ">=6" }, "Devdependencies": { "Autoprefixer": "^6.6.0", "Babel-core": "^6.24.1", "Babel-loader": "^6.4.0", "Babel-preset-vue-app": "^1.2.0", "Css-loader": "^0.27.0", "File-loader": "^0.10.1", "Html-webpack-plugin": "^2.24.1", "Postcss-loader": "^1.3.3", "Rimraf": "^2.5.4", "Style-loader": "^0.13.2", "Url-loader": "^0.5.8", "Vue-loader": "^13.3.0", "Vue-template-compiler": "^2.5.16", "Webpack": "^2.4.1", "Webpack-dev-server": "^2.4.2" }}
View Code
2. Webpack.config.js
Const RESOLVE = require (' path '). Resolveconst Webpack= Require (' Webpack ') Const Htmlwebpackplugin= Require (' Html-webpack-plugin ') Const URL= require (' URL ') Const Publicpath= ' 'Module.exports= (options = {}) = =({entry: {vendor:'./src/vendor ', Index:'./src/main.js '}, Output: {path:resolve (__dirname,' Dist '), Filename:options.dev? ' [name].js ': ' [name].js? [Chunkhash] ', Chunkfilename:' [Id].js? [Chunkhash] ', PublicPath:options.dev? '/assets/': Publicpath}, module: {rules: [{test:/\.vue$/, use: [' Vue-loader ']}, {test:/\.js$/, use: [' Babel-loader '], exclude:/node_modules/}, {test:/\.css$/, use: [' Style-loader ', ' css-loader ', ' Postcss-loader ']}, {test:/\. (PNG|JPG|JPEG|GIF|EOT|TTF|WOFF|WOFF2|SVG|SVGZ) (\?. +)?$/, use: [{loader:' Url-loader ', Options: {limit:10000}}]} ]}, plugins: [NewWebpack.optimize.CommonsChunkPlugin ({names: [' Vendor ', ' manifest '] }), NewWebpack. Defineplugin ({__target__: json.stringify (Process.env.TARGET|| ' Prod ') }), Newhtmlwebpackplugin ({Template:' Src/index.html '})], resolve: {alias: {' ~ ': Resolve (__dirname, ' src ')), ' @ ': Resolve (' src '))}, extensions: ['. js ', '. Vue ', '. json ', '. css ']}, Devserver: {host:' 0.0.0.0 ', Port:8010, Proxy: {'/api/': {target:' http://0.0.0.0:8080 ', Changeorigin:true, Pathrewrite: {' ^/api ': '}}}, Historyapifallback: {index:url.parse (Options.dev? '/assets/': Publicpath). Pathname}}, Devtool:options.dev? ' #eval-source-map ': ' #source-map '})
View Code
3.api.js
Axios.defaults.baseURL = ' test.com 'if (__target__ = = = ' prod ') { = ' prod.com '}
View Code
Vue+element switching between formal and test environments