1.1.5 • Published 8 years ago
@beisen/talent-ui-dll-webpack-config v1.1.5
talent-ui-dll-webpack-config
说明
用来协助生成talent-ui 2.0可以自动识别的dll的工具, 你可以自己配置DllPlugin来生成Dll, 但是talent-ui-dll-webpack-config集成了一套统一的逻辑和命名规则,可以让talent-ui-webpack-config自动识别出文件路径。并且可以自动根据生产或者开发环境自动选取对应文件。
输出的dll文件名称是通过读取dll项目的package.json中的name和version并交给 talent-ui-dll-naming-convention来自动生成。在talent-ui-webpack-config中也使用了这个naming-convention。所以通过talent-ui-dll-webpack-config生成的dll被自动识别出来。
通过talent-ui-dll-webpack-config生成的dll会同时输出生产环境和开发环境的dll, 开发环境的dll, 使用了NamedModulePlugin,而生成环境的dll没有使用NamedModulePlugin, 使用了UglifyJSPlugin来压缩输出代码。
应用
初始化项目:
    yarn init -y安装talent-ui-dll-webpack-config
    yarn add @beisen/talent-ui-dll-webpack-config --dev
    在你的应用项目下面创建webpack.config.js
    const dllWebpackConfig = require('@beisen/talent-ui-dll-webpack-config');
    const path = require('path');
    module.exports = dllWebpackConfig({
        root: path.resove(__dirname /**/) //这里统一为项目的根目录,方便使用统一的context,
        venders: require('./vender-list')
    })创建vender-list.js
    module.exports = [
        'react',
        'react-dom',
        ...所有你想引进来的库
    ]安装你需要打包的库
    yarn add react react-dom ....执行打包:
    webpack -c webpack/webpack.config.js查看输出文件,假如你package.json中的name是 qd-fed-dll, 版本号是1.0.0, 则输出的文件应该包含:
    //生产环境带版本号
    - qd-fed-dll-1.0.0.min.js
    - qd-fed-dll-1.0.0.manifest.json
    //开发环境不带版本号
    - qd-fed-dll.dev.js
    - qd-fed-dll.dev.manifest.json