ant-tool AXE 升级日志 - 用户版

[sorrycc]

亲爱的 ant-tool 用户：

ant-tool 做了一系列的更新，代号为 AXE，包含一些有趣的新特性。你可以通过 [email protected] 获得，或者把所有依赖更新为最新。

值得一提

自动安装 npm 依赖，并保存到 dependencies

支持 css modules

老项目不用担心兼容问题，css modules 是通过匹配 *.module.css 支持的。

示例：

Header.jsx

import style from './Header.less';
export default () => <div className={style.normal} />;

Header.less

.normal { color: red; }

支持 rucksack

更有趣的 css 开发体验。

比如：

.foo {
  position: absolute 0;
}

支持 decorator

示例：

@autobind
method() {
  return this.value;
}

webpack.config.js 配置简化

babel 和 UglifyJsPluginConfig 的配置提取到 webpackConfig 上，可直接修改。

比如：

module.exports = function(webpackConfig) {
  webpackConfig.babel.plugins.push('antd');
  return webpackConfig;
};

其他

支持 webpackConfig 是数组的场景 (处理完 i18n 之后)

有多语言需求的同学可以尝试下

watch 模式下精简日志信息

和 server 模式的日志保持一致

添加 NoErrorsPlugin 插件，构建出错时不生成文件

for qingting, @慕陶

js 里 require 的 html 文件会被复制到输出目录

for 离线包需求

proxy -> dora 的地址换成本机 (127.0.0.1)

开着 vpn 也可以用了
从楼下走到楼上也不用重启命令了 (切换了网络环境)

sourcemap 配置换成 cheap-module-eval-source-map

不用管为啥，总之会快一点

修改 package.json 和 webpack.config.js 不用手动重启命令

工具会帮你重启

升级日志 - 开发者版

• 0.6.0 需求收集 atool-build#61
• [email protected] 以及相关插件的需求整理 dora-js/dora#26

广告

• React + Redux 最佳实践 及其 脚手架

[yiminghe]

有些功能能不能提供个开关： 自动依赖，rucksack 等，有些不是很喜欢。。。

[sorrycc]

rucksack 不影响的，是 postcss 的一个封装。自动依赖安装可以搞个开关。

[lifesinger]

好详细的升级日志，赞。

[oxbambooxo]

当 webpack.config.js 中有 webpackConfig.babel.plugins.push('antd'); 时会报错：

webpackConfig.babel.plugins.push('antd');
                 ^

TypeError: Cannot read property 'plugins' of undefined
    at module.exports (/Users/bamboo/antd-front-end/webpack.config.js:5:22)
    at mergeCustomConfig (/usr/local/lib/node_modules/atool-build/lib/mergeCustomConfig.js:25:25)
    at getWebpackConfig (/usr/local/lib/node_modules/atool-build/lib/build.js:107:51)
    at exports.default (/usr/local/lib/node_modules/atool-build/lib/build.js:11:23)
    at Object.<anonymous> (/usr/local/lib/node_modules/atool-build/bin/atool-build:15:24)
    at Module._compile (module.js:425:26)
    at Object.Module._extensions..js (module.js:432:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Function.Module.runMain (module.js:457:10)

改成和这里的 atool-build/issues/46 配置一样后就可以了：

webpackConfig.module.loaders.forEach(function(loader) {
    if (loader.loader === 'babel') {
      // https://github.com/ant-design/babel-plugin-antd
      loader.query.plugins.push('antd');
    }
    return loader;
  });

[sorrycc]

检查下 atool-build 的版本是否 >= 0.6

[oxbambooxo]

果然。。是用npm 3.3.6装的，版本是 0.4.4。