webpack替换配置项和压缩js、css,不打包!不打包!不打包!

问题描述

一个js工具项目,有多个目录,部署好以后提供地址给别人调用,但是项目里有些api接口地址开发、测试、生产各个环境不一样,所以想把各环境配置好以后,使用webpack的define插件进行替换。
我期望的就是只想替换配置项和压缩js、css,不打包,不打包,不打包

问题出现的环境背景及自己尝试过哪些方法

调研的时候只尝试了单个文件的define替换,没有问题,实际应用到项目里发现,entry可以通过glob生成,但是在编译过程中会进行打包,就报错某些Module not found,进行不下去了。

相关代码

// 请把代码文本粘贴到下方(请勿用图片代替代码)

//entries函数
var entries= function () {
 var srcDir = resolve('/src/')
 var entryFiles = glob.sync(srcDir + '**/*.js')
 var map = {};
 for (var i = 0; i < entryFiles.length; i++) {
  var filePath = entryFiles[i];
  var filename = filePath.substring(filePath.lastIndexOf('\/') + 1, filePath.lastIndexOf('.'));
  map[filename] = filePath;
 }
 console.log(map)
 return map;
}

// define
new webpack.DefinePlugin(function () {
    let obj = {}
    for (let key in config) {
        obj['envConfig.' + key] = config[key]
    }
    return obj
}())

你期待的结果是什么?

不知道有没有什么方案可以实现我的期望,希望各位有经验的大佬能助我一臂之力,谢谢!

阅读 3.8k
4 个回答

如果只是替换为啥要用 webpack,随便写个脚本当纯文本读进来替换完写回去就好了。

可以用 externals

不打包的话就不要用webpack了。

最后没有使用webpack了,webpack模块化打包,不适合我的场景。
用nodejs遍历目录各种逻辑判断完成了。
谢谢回答的两位

流程处理,可以使用gulp和grunt等流程处理工具。
至于代码压缩可以使用对应的插件,不打包。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进