easywebpack4

easywebpack - 基于 Webpack 前端工程构建方案, 支持 Webpack Vue, React, Weex, JS, Weex等多种前端框架构建, 包括 Webpack Vue SSR, Webpack React SSR 构建。

Date: 2019-12-23

Word Count: 1.2k

Read Times: 5 Min

Read Count:

方案说明

Webpack4

插件版本

easywebpack: ^4.x.x
easywebpack-cli: ^4.x.x
easywebpack-vue: ^4.x.x
easywebpack-react: ^4.x.x
easywebpack-html: ^4.x.x
easywebpack-js: ^4.x.x
egg-webpack: ^4.x.x
webpack-tool: ^4.x.x

发布历史

https://github.com/hubcarl/easywebpack/blob/master/CHANGELOG.md

版本特性

2019-10

Feature

提供 easy-team 插件模式快速升级 Babel 方案（Babel6 -> Babel7)，后续所有骨架降改成此方案。

为了更方便升级 Babel7, 同时尽量减少配置且无需安装 @babel 依赖，@easy-team 模式直接内置Babel 7 的相关依赖，只需要把 easywebpack 依赖模式改成 @easy-team/easywebpack 模式，如果代码中直接依赖了也请一并修改。更多详细信息见：https://easy-team.gitee.io/easywebpack/babel7 。

@easy-team/easywebpack-cli: ^4.0.0 替换 easywebpack-cli
@easy-team/easywebpack-react: ^4.0.0 替换 easywebpack-react
@easy-team/easywebpack-vue: ^4.0.0 替换 easywebpack-vue

easy-team 模式使用 babel.config.js 替换 .babelrc 配置
easy-team 模式支持 Babel 7 同构应用根据不同平台编译成不同 ECMAScript 版本规范

module.exports = {
  "env": {
    "node": {
      "presets": [
        [
          "@babel/preset-env",
          {
            "modules": false,
            "targets": {
              "node": "current"
            }
          }
        ]
      ],
      "plugins": [    
        "@babel/plugin-syntax-dynamic-import"
      ]
    },
    "web": {
      "presets": [
        [
          "@babel/preset-env",
          {
            "modules": false,
            "targets": {
              "browsers": [
                "last 2 versions",
                "safari >= 8"
              ]
            }
          }
        ]
      ],
      "plugins": [
        "@babel/plugin-proposal-object-rest-spread",
        "@babel/plugin-syntax-dynamic-import",
        "@babel/plugin-transform-object-assign"
      ]
    }
  }
}

2019-09

Feature

easywebpack-cli 支持 easy server 命令启动 HTTP Static Server 展示文件目录导航

2019-07

Feature

easywebpack 提供内置 babel 7 升级方案，具体见 https://easy-team.gitee.io/easywebpack/babel7

2019-03

Feature

easywebpack-vue 发布 4.5.0 版本内置的 vue-loader@14 升级为 vue-loader@15

2018-11

Feature

easywebpack 4.11.0 修复 vue-loader 和 ts-loader 新版本问题
easywebpack 4.11.0 loaders.typescript 改成 loaders.ts

easywebpack 4.11.0 新增 Webpack output.path 和 output.publicPath 原生配置支持

easywebpack 4.11.0 新增支持 module.rules 内置和原生混合配置模式

easywebpack 4.10.0 新增 filter: webpack-filter-warnings-plugin 插件
easywebpack 4.10.0 支持公共 css 提取，具体见公共提取
easywebpack 4.10.0 支持 config.devServer 配置，支持 historyApiFallback 和 proxy 配置
Vue TypeScript Node Isomorphic Framework ves, ves-cli, ves-admin
babel 提供默认配置，详见 https://easy-team.gitee.io/easywebpack/babel
easywepback ^4.9.0 支持 SSR babel 按需配置，提高构建速度，详见 Egg + Vue 和 Egg + React
easywepback ^4.9.0 提供 customize 方法对生成的 webpack 直接进行加工处理

//${root}/webpack.config.js
module.exports = {
  ...
  customize(webpackConfig){ // 此外 webpackConfig 为原生生成的 webpack config
   return webpackConfig;
  }
}

easywepback ^4.9.0 默认开启 babel 和 ts 的 thread-loader 和 cache-loader , 加快构建速度；如果出现问题，请通过如下方式开启和禁用

//${root}/webpack.config.js
module.exports = {
 compile: {
   thread:false,
   cache:false
 }
}

easywepback ^4.9.0 开始默认禁用 eslint-loader , 加快构建速度, 可以通过如下方式开启和禁用

//${root}/webpack.config.js
module.exports = {
 loaders;{
   eslint: true
 }
}

easywebpack-react ^4.4.0 支持 AntD Theme 主题配置

https://github.com/easy-team/egg-react-webpack-boilerplate/issues/11
https://github.com/easy-team/egg-react-webpack-boilerplate/tree/antd-theme

easywebpack-cli ^4.3.0 支持扩展新的 cli (例如：ves-cli)

2018-10

*配置增加支持 plugins:[] 和 {} 混合模式配置 *（easywebpack@4.8.5)
*配置增强集成 copy-webpack-plugin 插件, 通过 plugins.copy 配置 *（easywebpack@4.8.5)
配置简化 egg 项目 egg 无需配置，解决方案支持自动检测功能（easywebpack@4.8.0)
配置简化 egg 项目 framework 无需配置，解决方案支持自动检测功能（easywebpack@4.8.0)
配置简化 entry 提供默认值配置，为 { index: src/app.js } （easywebpack@4.8.0)
配置增强 entry 支持 node-glob 模式配置（easywebpack@4.8.0)
配置简化 entry 支持 template loader 配置（easywebpack@4.8.0)
配置简化 webpack.config.js devtool 配置只在本地 dev 模式有效, 默认为 eval。可以通过 easy build --devtool 强制指定 devtool （easywebpack-cli@4.0.0)
配置简化 postcss.conf.js 提供默认配置（easywebpack@4.8.0)
配置简化 easy build 默认 prod 发布模式（easywebpack-cli@4.0.0)
*配置简化 *babel 相关的 devDependencies 依赖解决方案已内置，无需项目显示配置依赖（easywebpack@4.8.0)
开发增强 **自动解决本地开发时端口占用问题，支持多项目自动获取新的端口号 **（easywebpack-cli@4.0.0 和 easywebpack@4.8.0）