@kdcloudjs/kwc-webpack-plugin

This plugin allows you to use KWC within any web framework project that uses Webpack.

Install

npm install --save-dev @kdcloudjs/kwc-webpack-plugin @kdcloudjs/kwc @kdcloudjs/kwc-module-resolver

Note that you must install your own dependencies for @kdcloudjs/kwc and @kdcloudjs/kwc-module-resolver.

Usage

const KwcWebpackPlugin = require('@kdcloudjs/kwc-webpack-plugin')

module.exports = {
    plugins: [new KwcWebpackPlugin()]
}

The above example assumes that you have configured KWC modules via kwc.config.json in your project root, or as kwc key in your package.json.

Pass the module configuration as parameter to the plugin, if you prefer to not use any of the above mentioned KWC module configuration options.

const KwcWebpackPlugin = require('@kdcloudjs/kwc-webpack-plugin')

module.exports = {
    plugins: [
        new KwcWebpackPlugin({
            modules: [
                { npm: '@kdcloudjs/kingdee-base-components' }
            ]
        })
    ]
}

TypeScript

If you want to use TypeScript in your KWC components, you can install the necessary Babel dependencies:

npm install --save-dev \
    babel-loader@^8 \
    @babel/preset-typescript@^7 \
    @babel/plugin-syntax-decorators@^7

Then add this to your webpack.config.js:

module.exports = {
  plugins: [
    new KwcWebpackPlugin(),
    // Add this _after_ KwcWebpackPlugin:
    {
      apply(compiler) {
        compiler.options.module.rules.push({
          test: /\.ts$/,
          exclude: /node_modules/,
          use: {
            loader: 'babel-loader',
            options: {
              presets: ['@babel/preset-typescript'],
              plugins: [['@babel/plugin-syntax-decorators', { legacy: true }]],
            }
          }
        })
      }
    }
  ]
}

You may customize the babel-loader settings to suit your needs.