webpack有一个DefinePlugin接口,可以实现根据开发与生产环境配置不同变量。范例如下:

需求:开发环境请求baseUrl = '';生产环境请求 baseUrl = 'http://localhost:8066'

实施:

1,webpack.dev.config.js:

new webpack.DefinePlugin({
DEVELEPMENT: JSON.stringify(true),
PRODUCTION: JSON.stringify(false),
})

2,webpack.prod.config.js:

new webpack.DefinePlugin({
PRODUCTION: JSON.stringify(true),
DEVELEPMENT: JSON.stringify(false), })

3,utils.js:

if(PRODUCTION){
var baseUrl = ''
}else if(DEVELEPMENT){
var baseUrl = 'http://localhost:8066'
}
export default {
baseUrl
}

原文链接 https://blog.csdn.net/yingxiongfengyun2020/article/details/80661031?utm_source=copy

webpack根据开发与生产环境配置不同变量--webpack.DefinePlugin的更多相关文章

  1. 用前端姿势玩docker【四】基于docker快速构建webpack的开发与生产环境

    目录 用前端姿势玩docker[一]Docker通俗理解常用功能汇总与操作埋坑 用前端姿势玩docker[二]dockerfile定制镜像初体验 用前端姿势玩docker[三]基于nvm的前端环境构建 ...

  2. webpack开发与生产环境配置

    前言 作者去年就开始使用webpack, 最早的接触就来自于vue-cli.那个时候工作重点主要也是 vue 的使用,对webpack的配置是知之甚少,期间有问题也是询问大牛 @吕大豹.顺便说一句,对 ...

  3. webpack深入场景——开发环境和生产环境配置

    以前自己写一小项目时,webpack的配置基本就是一套配置,没有考虑生产环境和开发环境的区分,最近在做一个复杂的商城项目接触到了webpack的高级配置,经过两天的研究,写出了一份目前来说比叫满意的配 ...

  4. webpack开发环境配置和生产环境配置

    开发环境配置 在开发环境下,我们首先考虑的是方便开发,方便代码调试,不需要考虑代码合并和css样式分离这些. 这里主要说三个 :1.css模块化:2.模块热替换功能:3.source-map(代码映射 ...

  5. Webpack4 学习笔记八 开发环境和生产环境配置

    webpack resolve属性 webpack 区分开发环境和生产环境 webpack resolve属性 该选项的作用是设置模块如何被解析. resolve.alias: 设置别名, 在vue中 ...

  6. webpack 之 一个简单的基本生产环境配置

    webpack 之 一个简单的基本生产环境配置 // 用来拼接绝对路径的方法 const {resolve} = require('path') const HtmlWebpackPlugin = r ...

  7. 转 通过 spring 容器内建的 profile 功能实现开发环境、测试环境、生产环境配置自动切换

                                      软件开发的一般流程为工程师开发 -> 测试 -> 上线,因此就涉及到三个不同的环境,开发环境.测试环境以及生产环境,通常 ...

  8. 记录自己的 django管理 开发环境 和 生产环境 配置过程

    背景:自己的博客部署到服务器了,可每次上传服务器都要把配置重新该,包括数据库链接也得改,于是就需要管理开发环境和生产环境配置. 1, 这是目录结构,在blog下新建一个settings包,里面新建有c ...

  9. spring boot--日志、开发和生产环境切换、自定义配置(环境变量)

    Spring Boot日志常用配置: # 日志输出的地址:Spring Boot默认并没有进行文件输出,只在控制台中进行了打印 logging.file=/home/zhou # 日志级别 debug ...

随机推荐

  1. Centos7中网络及设备相关配置

    centos7中,不再赞成使用ifconfig工具,取而代之的是nmcli工具,服务管理也是以systemctl工具取代了service,这些之前版本的工具虽然在centos7中还可以继续使用,只是出 ...

  2. Java编程思想--控制执行流程

    java控制流程设计的关键字包括if-else,while,do-while,for,return,break,continue以及switch.(go-to) 1.while在迭代之前计算一次布尔表 ...

  3. PDF 补丁丁 0.6.0.3326 版发布(修复提取图片的问题)

    新的 PDF 补丁丁已经发布. 新版本更新了 PDF 渲染引擎. 另外修复了网友提出的提取图片功能中的两个问题.

  4. OpenCV(一):集成

    开这个系列文章,记录自己在项目中使用OpenCV所走的步骤流程,方便以后再次使用.如果有不正确的地方,欢迎指正. OpenCV在其官网上,已经发布有iOS版的库,但是只有核心模块的功能,扩展模块(比如 ...

  5. jenkins+svn 打包部署上传服务器并正常运行项目,从安装到使用

    以前写过一个版本,jenkins打包部署的全果然,然后...没保存,现在重新写一个版本从按照开始. 项目平时部署情况,svn拉代码,开发打包后进行给测试,测试上传到跳板机,杀掉以前项目进程,上传到服务 ...

  6. [HAOI2008]移动玩具

    这又是一道神奇的搜索题...只要记录每种状态...然后暴力判断这种状态往后一步的情况... 广搜出最优解即可... 呆码: #include<iostream> #include<c ...

  7. js之 单例模式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. vue跳坑笔记

    序号 报错截图 关键词 解决办法 1 - code EPERM errno 4048 syscall scandir operation not permitted 清除npm缓存,命令: npm c ...

  9. python3读取sqlyog配置文件中的MySql密码

    这个人有什么目的?: 我多多少少听过一些安全圈的大牛说到类似的思路,大意是可以通过扫描各种程序和服务的配置文件(比如SVN的文件,RSYNC的配置文件等), 从中发现敏感信息,从而找到入侵的突破口.沿 ...

  10. 推理机Jess,Racer,Jena

    推理机 Jess(Java Expert Shell System)是基于Java语言的CLISP推理机. CLISP是基于产生式的前向推理引擎,许多上层的推理任务,都要映射到这个推理引擎上来运行. ...