release/component-1.7.0 (#213)

* fix: dts file generate error at windows (#173)
* feat: 🎸 support define
* feat/https (#218)

Co-authored-by: duwenbin0316 <31891889+duwenbin0316@users.noreply.github.com>
Co-authored-by: mskj-duwenbin <duwenbin@mskj.com>

Author: 3 people

packages/build-plugin-component/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 1.7.0
+
+- [feat] support `https` cli option
+- [feat] support `define` user config option
+- [fix] generate .d.ts files for win32
+
 ## 1.6.6
 
 - [hotfix] 修复 inlineStyle 默认为 true 这一行为逻辑的 break change ([#214](https://github.com/ice-lab/iceworks-cli/issues/214))

packages/build-plugin-component/package.json

@@ -1,6 +1,6 @@
 {
   "name": "build-plugin-component",
-  "version": "1.6.6",
+  "version": "1.7.0",
   "description": "build plugin for component development",
   "main": "src/index.js",
   "scripts": {
@@ -28,6 +28,7 @@
     "@babel/types": "^7.7.2",
     "babel-plugin-import": "^1.12.2",
     "babel-plugin-module-resolver": "^4.0.0",
+    "babel-plugin-transform-define": "^2.0.0",
     "build-scripts-config": "^0.1.0",
     "camelcase": "^6.2.0",
     "case-sensitive-paths-webpack-plugin": "^2.3.0",

packages/build-plugin-component/src/compiler/babel.js

@@ -83,7 +83,16 @@ module.exports = function babelCompiler(
   type,
 ) {
   const { rootDir, pkg } = context;
-  const { compilerOptions = {}, babelPlugins = [], babelOptions = [], alias, subComponents } = userOptions;
+  const { compilerOptions = {}, babelOptions = [], alias, subComponents, define } = userOptions;
+  const { babelPlugins = [] } = userOptions;
+
+  if (define) {
+    babelPlugins.push([
+      require.resolve('babel-plugin-transform-define'),
+      define,
+    ]);
+  }
+
   // generate DTS for ts files, default is true
   const { declaration = true } = compilerOptions;
   const componentLibs = analyzePackage(pkg, basicComponents);

packages/build-plugin-component/src/compiler/dts.js

@@ -7,6 +7,7 @@ const path = require('path');
 const fse = require('fs-extra');
 const ts = require('typescript');
 const { REG_TS } = require('../configs/reg');
+const formatPathForWin = require('../utils/formatPathForWin');
 
 // compile options
 const options = {
@@ -40,7 +41,7 @@ module.exports = function dtsCompiler(compileInfo, log = console) {
   const program = ts.createProgram(needCompileList.map(({ sourceFile }) => sourceFile), options, host);
   const emitResult = program.emit();
   if (emitResult.diagnostics && emitResult.diagnostics.length > 0) {
-    emitResult.diagnostics.forEach(diagnostic => {
+    emitResult.diagnostics.forEach((diagnostic) => {
       const message = ts.flattenDiagnosticMessageText(diagnostic.messageText, '\n');
       if (diagnostic.file) {
         const { line, character } = diagnostic.file.getLineAndCharacterOfPosition(diagnostic.start);
@@ -52,7 +53,9 @@ module.exports = function dtsCompiler(compileInfo, log = console) {
   }
 
   needCompileList.forEach(({ targetPath, fileNamesDTS }) => {
-    const content = createdFiles[fileNamesDTS];
+    const content = createdFiles[
+      formatPathForWin(fileNamesDTS)
+    ];
     // write file
     if (content) {
       fse.ensureDirSync(path.dirname(targetPath));

packages/build-plugin-component/src/configs/rax/getBaseWebpack.js

@@ -10,7 +10,7 @@ const TimeFixPlugin = require('time-fix-plugin');
 
 module.exports = (context, options) => {
   const { rootDir, command, pkg, webpack } = context;
-  const { isES6, target, name, inlineStyle = true } = options || {};
+  const { isES6, target, name, inlineStyle = true, https } = options || {};
   const config = new Chain();
 
   const babelConfig = getBabelConfig({
@@ -101,6 +101,8 @@ module.exports = (context, options) => {
   if (command === 'start') {
     config.mode('development');
     config.devtool('inline-module-source-map');
+
+    config.devServer.https(Boolean(https));
   } else if (command === 'build') {
     config.mode('production');
     // support production sourcemap

packages/build-plugin-component/src/configs/react/dev.js

@@ -1,6 +1,7 @@
 const setAssetsPath = require('../../utils/setAssetsPath');
 
-module.exports = (config) => {
+module.exports = (config, options) => {
+  const { https } = options;
   setAssetsPath(config, { js: 'js', css: 'css' });
   // config loglevel
   config.merge({
@@ -12,4 +13,6 @@ module.exports = (config) => {
     .hot(true)
     .disableHostCheck(true)
     .clientLogLevel('silent');
+
+  config.devServer.https(Boolean(https));
 };

packages/build-plugin-component/src/configs/react/userConfig.js

@@ -64,4 +64,8 @@ module.exports = [
     name: 'htmlInjection',
     validation: 'object',
   },
+  {
+    name: 'define',
+    validation: 'object',
+  },
 ];

packages/build-plugin-component/src/rax.js

@@ -48,7 +48,7 @@ module.exports = ({
     console.log();
     process.exit(1);
   }
-  const { skipDemo } = commandArgs;
+  const { skipDemo, https } = commandArgs;
   const watchDist = commandArgs.watchDist || userConfig.watchDist;
   const isRuntimeMiniapp = targets.includes(MINIAPP) && miniapp && miniapp.buildType === 'runtime';
 
@@ -70,7 +70,7 @@ module.exports = ({
   let demos = [];
 
   // register cli options
-  const cliOptions = ['watch-dist', '--skip-demo'];
+  const cliOptions = ['watch-dist', '--skip-demo', 'https'];
   registerCliOption(
     cliOptions.map((name) => ({
       name,
@@ -120,7 +120,12 @@ module.exports = ({
   // plugins depend on task names, change task name rule will cause break change.
   if (command === 'start' && !watchDist) {
     targets.forEach((target) => {
-      const options = { ...compileOptions, target, inlineStyle };
+      const options = {
+        ...compileOptions,
+        target,
+        inlineStyle,
+        https,
+      };
       if ([WEB, WEEX, NODE, KRAKEN].includes(target)) {
         // eslint-disable-next-line
         const configDev = require(`./configs/rax/${target}/dev`);

packages/build-plugin-component/src/react.js

@@ -28,6 +28,7 @@ module.exports = (
   const { command, rootDir, pkg, commandArgs, userConfig } = context;
   const { plugins, ...compileOptions } = userConfig;
   const { library, demoTemplate = 'template-component-demo', basicComponents = [] } = compileOptions;
+  const { https } = commandArgs;
 
   // config htmlInjection for once
   if (userConfig.htmlInjection) {
@@ -47,9 +48,11 @@ module.exports = (
     registerTask(taskName, webpackConfig);
     const outputDir = path.join(rootDir, 'node_modules', '_component_demo');
     fs.ensureDirSync(outputDir);
+
     const params = {
       rootDir,
       pkg,
+      https,
     };
 
     const generateDemoEntry = () => {
@@ -142,7 +145,7 @@ module.exports = (
   }
 
   // register cli options
-  const cliOptions = ['watch', 'skip-demo', 'watch-dist'];
+  const cliOptions = ['watch', 'skip-demo', 'watch-dist', 'https'];
   registerCliOption(cliOptions.map((name) => ({
     name,
     commands: ['start', 'build'],

packages/build-plugin-component/src/utils/getUMDWebpack.js

@@ -6,7 +6,7 @@ const { defaultDynamicImportLibraries } = require('../compiler/depAnalyze');
 module.exports = ({ context, compileOptions, extNames, hasMain }) => {
   const mode = 'production';
   const config = getWebpackConfig(mode);
-  const { rootDir } = context;
+  const { rootDir, webpack } = context;
   const {
     // dist minify
     minify,
@@ -46,6 +46,7 @@ module.exports = ({ context, compileOptions, extNames, hasMain }) => {
       },
     },
     basicComponents = [],
+    define,
   } = compileOptions;
   const { jsExt, styleExt } = extNames;
   // file name
@@ -144,5 +145,21 @@ module.exports = ({ context, compileOptions, extNames, hasMain }) => {
     config.optimization.minimize(minify);
   }
 
+  if (define) {
+    const defineVariables = {};
+    Object.keys(define).forEach((defineKey) => {
+      defineVariables[defineKey] = JSON.stringify(define[defineKey]);
+    });
+
+    if (config.plugins.get('DefinePlugin')) {
+      config
+        .plugin('DefinePlugin')
+        .tap((args) => [Object.assign(...args, defineVariables)]);
+    } else {
+      config.plugin('DefinePlugin')
+        .use(webpack.DefinePlugin, [defineVariables]);
+    }
+  }
+
   return config;
 };