CDN 配置
基本配置
easywebpack 提供了 cdn 配置节点, 只需要配置 cdn 地址即可(cdn地址会覆盖publicPath地址).配置如下:
// ${app_root}/webpack.config.js module.exports = { ...... cdn:{ url: 'http://xxx.cdn.com' } done(){ // upload static file to cdn: http://xxx.cdn.com } } 实战配置
注意:实际项目具体做法一般是只有上线部署才使用 cdn 生效. 我们可以在 Webpack 构建完成后, 在 done 函数里面上传静态资源到 cdn.url 地址. 我们可以通过添加环境变量的方式决定是否需要上传CDN, 从而控制本地开发构建不上传CDN, 只有在CI构建(CI环境里面定义UPLOAD_CDN环境变量)时才触发CDN流程.
// ${app_root}/webpack.config.js const UPLOAD_CDN = process.env.UPLOAD_CDN; module.exports = { ...... cdn:UPLOAD_CDN ? { url: 'http://xxx.cdn.com/public/' }: {}, done(){ // upload static file to cdn: http://xxx.cdn.com if(UPLOAD_CDN){ } } } 打包配置
packjson.json 本地打正式包配置
在 npm run build 打正式包的时候, 开启 UPLOAD_CDN 开关
{ "script" :{ "build:dev": "cross-env easywebpack build dev", "build:test": "cross-env easywebpack build test", "build": "cross-env UPLOAD_CDN=true easywebpack build prod" } } packjson.json CI 打正式包配置
这里无需配置 UPLOAD_CDN 参数, 请在 CI 系统配置 UPLOAD_CDN 环境变量
{ "script" :{ "build:dev": "cross-env easywebpack build dev", "build:test": "cross-env easywebpack build test", "build": "cross-env easywebpack build prod" } }