配置

ykit.{type}.js 文件示例

exports.config = function() {
    return {
        export: [
            // 项目资源入口
            './scripts/index.js',
            './styles/index.scss',

            // 项目资源分组
            {
                name: 'common',
                export: [
                    './common_dir/util.js',
                    './common_dir/common.css'
                ]
            }
        ],
        modifyWebpackConfig: function(baseConfig) {
            // 修改 webpack 编译配置
            // ...

            return baseConfig
        },
        sync: {
            // sync到开发机配置
            host: "192.168.237.71",
            path: "/home/q/www/qunarzz.com/#_name"
        },
        command: [{
            name: '#_name_cmd',
            module: {
                usage: '项目自定义命令',
                run: function() {}
            }
        }]
    }
};

配置项

• export - 设置资源入口。与 Fekit 相同，其中所有路径均默认相对于src目录，在本地请求 / 打包阶段，将会导出至 prd / dev 目录。同时也支持设置入口分组，打包时可针对分组进行打包。
• sync - 设置同步开发机的配置，需要设置开发机的 IP，以及项目要存储的路径。
• command - 设置项目自定义命令，在项目目录下执行ykit {cmd}即可运行。

modifyWebpackConfig

modifyWebpackConfig是一个可选的配置方法，来修改当前默认的 webpack 配置。比如添加新的 webpack 插件，修改某种类型文件的 loader 等等。如果涉及比较复杂的操作（如替换 loader），可使用 webpack-merge。

老版本的 ykit 项目中可能会有 setCompiler 方法，和 modifyWebpackConfig 功能是一样的

• 示例 - 添加 plugins：

var self = this;
return {
    ...,
    modifyWebpackConfig: function(baseConfig) {
        var webpack = self.webpack;
        var newPlugin = new webpack.DefinePlugin({
            "process.env": {
                NODE_ENV: JSON.stringify("production")
            }
        })

        baseConfig.plugins.push(newPlugin);
        return baseConfig;
    }
}

• 示例 - 修改 output：

modifyWebpackConfig: function(baseConfig) {
    baseConfig.output: {
        /**
         * output 是 webpack 中对于编译结果的配置
         * 在 ykit 中，根据每个环境(local / dev / prd)有特定的编译结果配置
         * 可以对特定环境下的 output 进行修改或重置
         */

        local: {
            // 重置本地 server 环境下配置
        },
        dev: baseConfig.output.dev, // 沿用 dev 环境下配置
        prd: baseConfig.output.prd  // 沿用 prd 环境下配置
    }
    return baseConfig;
}

配置函数上下文

业务在 ykit.{type}.js 中的配置函数上下文可以获取到当前的环境信息。

• env: 当前 ykit 的执行环境，分为 local / dev / prd，示例：

var self = this;
return {
    ...,
    modifyWebpackConfig: function(baseConfig) {
        switch (self.env) {
            case 'local':
                // 修改本地环境配置，在 ykit server 中访问项目会生效
                break;
            case 'dev':
                // 修改开发环境配置，在 ykit pack 时生效
                break;
            case 'prd':
                // 修改生产环境配置，在 ykit pack -m 时生效
                break;
            default:
        }

        return baseConfig;
    }
}

• webpack: 当前 ykit 内部 webapck，示例：

var self = this;
return {
    ...,
    modifyWebpackConfig: function(baseConfig) {
        var webpack = self.webpack;
        // 调用 webpack 内部插件等
        return baseConfig;
    }
}