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. iOS 开发学习-import和include的区别

    //当我们在代码中使用两次#include的时候会报错:因为#include相当于拷贝头文件中的声明内容,所以会报重复定义的错误 //但是使用两次#import的话,不会报错,所以他可以解决重复导入的 ...

  2. CS小分队第二阶段冲刺站立会议(6月1日)

    昨日成果:完成了,文件图标的获取,以及代码删除获取文件的图标的功能:实现了从桌面拖动一个应用到窗体进行添加的功能: 遇到问题:获取的文件图标太小了,比较模糊:从外面拖动文件到窗体时,图标一直获取错误, ...

  3. fir.im的高级统计功能

    fir.im的高级统计功能,可以根据渠道和活动名称,统计不同渠道和活动带来的下载量.操作步骤如下: 第一步:生成统计链接 点击高级统计,进入统计详情页,然后点击生成统计链接: 设置统计链接的应用版本. ...

  4. java如何写入txt文件

    public class TxtWrite { public static void main(String args[]){ contentToTxt("D:\\xyky.txt" ...

  5. mysql 时间格式化参数表笔记

    DATE_FORMAT() 函数用于以不同的格式显示日期/时间数据. 语法: DATE_FORMAT(date,format) 实例: DATE_FORMAT(NOW(),'%b %d %Y %h:% ...

  6. windows版本 rac 报错信息

    原因 - 安装程序无法在一个或多个节点上执行指定的脚本.这可能是由于在节点上执行脚本时出现异常错误. 操作 - 有关详细信息, 请查看日志文件 'C:\Users\ADMINI~1\AppData\L ...

  7. 自己用过的web软件tools软件以及玩过的游戏

    三年大学世界 最经常用的web网站估计就是淘宝了   最经常使用的工具软件也就是   Microsoft office,而最经常玩的游戏就是英雄联盟了一款pvp对战游戏 淘宝自不必说 可以称为国内最大 ...

  8. springcloud微服务实战:Eureka+Zuul+Feign/Ribbon+Hystrix Turbine+SpringConfig+sleuth+zipkin

    相信现在已经有很多小伙伴已经或者准备使用springcloud微服务了,接下来为大家搭建一个微服务框架,后期可以自己进行扩展.会提供一个小案例: 服务提供者和服务消费者 ,消费者会调用提供者的服务,新 ...

  9. 9款最佳的Linux文件比较工具

    程序员和撰稿人在编写程序文件或平常的文本文件时,有时想知道两个文件或同一文件的两个版本之间的差异.你在Linux上比较两个计算机文件时,文件内容之间的差异就叫diff.这一描述来源于提到diff的输出 ...

  10. Angular中ui-select的使用

    Angular中ui-select的使用 最近工作一直很忙,没有时间整理知识,前几天项目中需要用到angular-ui-select,实现下拉框快速过滤效果,今天有时间研究了一下,终于搞明白了. 一. ...