1.package.json

{
"name": "element-starter",
"description": "A Vue.js project",
"author": "yi.shyang@ele.me",
"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"
}
}

2. webpack.config.js

const resolve = require('path').resolve
const 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: [
new webpack.optimize.CommonsChunkPlugin({
names: ['vendor', 'manifest']
}),
new webpack.DefinePlugin({
__TARGET__: JSON.stringify(process.env.TARGET || 'prod')
}),
new HtmlWebpackPlugin({
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'
})

3.api.js

axios.defaults.baseURL = 'test.com'

if (__TARGET__ === 'prod') {
axios.defaults.baseURL = 'prod.com'
}

vue+element 切换正式和测试环境的更多相关文章

  1. webpack正式、测试环境接口地址本地运行及打包命令配置

    声明:本文由w3h5原创,转载请注明出处:<webpack正式.测试环境接口地址本地运行及打包命令配置> https://www.w3h5.com/post/521.html 为了方便开发 ...

  2. 《吐血整理》高级系列教程-吃透Fiddler抓包教程(25)-Fiddler如何优雅地在正式和测试环境之间来回切换-下篇

    1.简介 在开发或者测试的过程中,由于项目环境比较多,往往需要来来回回地反复切换,那么如何优雅地切换呢?宏哥今天介绍几种方法供小伙伴或者童鞋们进行参考. 2.实际工作场景 2.1问题场景 (1)已发布 ...

  3. 《吐血整理》高级系列教程-吃透Fiddler抓包教程(24)-Fiddler如何优雅地在正式和测试环境之间来回切换-中篇

    1.简介 在开发或者测试的过程中,由于项目环境比较多,往往需要来来回回地反复切换,那么如何优雅地切换呢?宏哥今天介绍几种方法供小伙伴或者童鞋们进行参考. 2.实际工作场景 2.1问题场景 (1)已发布 ...

  4. 《吐血整理》高级系列教程-吃透Fiddler抓包教程(23)-Fiddler如何优雅地在正式和测试环境之间来回切换-上篇

    1.简介 在开发或者测试的过程中,由于项目环境比较多,往往需要来来回回地反复切换,那么如何优雅地切换呢?宏哥今天介绍几种方法供小伙伴或者童鞋们进行参考. 2.实际工作场景 2.1问题场景 (1)已发布 ...

  5. SpringBoot+SpringCloud+vue+Element开发项目——搭建开发环境

    1.新建一个项目

  6. 无需编译app切换线上、测试环境

    在咱们测试过程中,经常需要切换测试环境和线上环境.大致有如下几个方案. 一.服务器地址编译到app中 此种方式需要在代码里保存两套配置,一套指向线上,一套指向测试.通过编译参数分别生成测试包.线上包. ...

  7. 服务端测试环境hosts配置检查脚本

    [本文出自天外归云的博客园] 问题 由于A测试环境和B测试环境相互耦合,B测试环境切换导致我方测试环境需要更改后台服务器的响应配置.若多台服务器中有一台服务器没有更改配置,则在测试过程中将会出现问题. ...

  8. vue分别打包测试环境和正式环境

    vue打包时使用不同的环境变量 需求 同一个项目通过打包使用不同的环境变量,目前的环境有三个: 一.本地------开发环境 二.线上------测试环境 三.线上------正式环境 我们都知道vu ...

  9. iOS如何在一个包上切换正式环境和测试环境

    最近项目处于测试阶段,所以免不了每天都得打包给测试人员,由于我们公司规模比较大,项目环境也分为了三种:测试环境.预上线(预生产)环境.上线(生产)环境.所以每到了测试后期,每天打包的时间也占了不少,遇 ...

随机推荐

  1. 在Windows下制作静态库和动态库

    一:静态库的创建 VC++6.0中new一个的为win32 static library工程,之后有二个选项.根据需求选吧. 具体的类或者函数的添加过程和标准的工程一样,直接创建新的类或者添加新 的. ...

  2. 《TCP/IP 详解 卷1:协议》第 11 章:名称解析和域名系统

    引言 到目前为止,我们使用 IP 地址来研究参与网络的主机.对于大众来说,这些地址太繁琐且难以记忆.为了使用如 TCP 和 IP 等协议,主机名称通过名为名称解析(name resolution)的过 ...

  3. 重学 以太网的mac协议的CSMA/CD

    之前上课一直模糊的CSMA/CD进行系统性整理. CSMA/CD (Carrier Sense Multiple Acess/Collision Detect)应用在OSI的 数据链路层 在以太网中, ...

  4. web安全测试系统

    最近写了个简单的web安全实践系统部署到了docker中 下载方式:docker pull ju5ton1y/websecurity github Dockerfile下载地址:https://git ...

  5. 性能分析_linux服务器CPU_Load Average

    CPU度量Load Average 1.  概念介绍 1.1  Linux系统进程状态 在linux中,process有以下状态: runnable (就绪状态):blocked waiting fo ...

  6. SQLSERVER STANDARD 版本不支持内存数据库

    1. 自己负责的一个环境 安装了 SQLSERVER2014 的 标准版 发现有问题. 恢复了一个带内存数据库的性能测试库之后报错. 报错信息很不明了,但是 查了半天发现必须升级企业版才可以... 还 ...

  7. Navicat for MySQL和Navicat Premium之间的区别

    首先两款软件都可以用来管理数据库链接MySQL和MariaDB 相对于新手或者前端工程师使用Navicat for MySQL就够了,功能相对于Navicat Premium比较少Navicat fo ...

  8. 传说中的WCF:消息拦截与篡改

    我们知道,在WCF中,客户端对服务操作方法的每一次调用,都可以被看作是一条消息,而且,可能我们还会有一个疑问:如何知道客户端与服务器通讯过程中,期间发送和接收的SOAP是什么样子.当然,也有人是通过借 ...

  9. ios开发之 -- xib关联自定义view

    在xib下使用自定义的view,因为很多时候,可能幸亏自顶一个view,然后在view里面填充控件,但是需要重写很多无用的 代码,而且很容易出错不说,还很好工作量,使用xib的话,分钟搞定一个view ...

  10. jenkins 通过maven部署Tomcat8报错

    问题过程 jenkins执行构建过程中,可以在workspace/项目名/target/目录下产生xxx.jar文件 但是在执行构建后操作时报出如下错误 [INFO] ---------------- ...