@pisell/build-plugin-lowcode 1.0.11 → 1.0.13-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/build-plugin-lowcode",
-  "version": "1.0.11",
+  "version": "1.0.13-beta.1",
   "description": "build plugin for component-to-lowcode",
   "main": "src/index.js",
   "keywords": [
@@ -44,7 +44,10 @@
     "rpx-loader": "^1.0.1",
     "style-loader": "^2.0.0",
     "url-loader": "^4.1.1",
-    "webpack": "^4.46.0"
+    "webpack": "^4.46.0",
+    "babel-plugin-import": "1.13.8",
+    "babel-loader": "8.2.5",
+    "webpack-bundle-analyzer": "4.10.1"
   },
   "devDependencies": {
     "np": "^7.7.0"

package/src/index.js

@@ -6,9 +6,11 @@ const chokidar = require('chokidar');
 const mergeWith = require('lodash/mergeWith');
 const parser = require('@alilc/lowcode-material-parser');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 const { getWebpackConfig } = require('build-scripts-config');
 const isWsl = require('is-wsl');
 
+
 let INIT_STATE = false;
 let PARSED_NPM_NAME;
 const { debug } = console;
@@ -197,7 +199,7 @@ const addPostCss = (config) => {
             [
               'postcss-preset-env',
               {
-                rootSelector: '#root',
+                rootSelector: '#body',
                 stage: 3,
                 browsers: [
                   'last 2 versions',
@@ -211,7 +213,7 @@ const addPostCss = (config) => {
             ],
             [
               require('postcss-add-root-selector')({
-                rootSelector: '#root',
+                rootSelector: '#body',
               })
             ]
           ],
@@ -230,7 +232,7 @@ const addPostCss = (config) => {
             [
               'postcss-preset-env',
               {
-                rootSelector: '#root',
+                rootSelector: '#body',
                 stage: 3,
                 browsers: [
                   'last 2 versions',
@@ -244,7 +246,7 @@ const addPostCss = (config) => {
             ],
             [
               require('postcss-add-root-selector')({
-                rootSelector: '#root',
+                rootSelector: '#body',
               })
             ]
           ],
@@ -253,6 +255,35 @@ const addPostCss = (config) => {
       .end();
 }
 
+const addBabelPluginImport = (config) => {
+  config.module
+      .rule("ts")
+      .test(/\.(ts|tsx)$/)
+      .use("babel-loader")
+      .loader("babel-loader")
+      .options({
+        presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript'],
+        plugins: [
+          [
+            'import',
+            {
+              libraryName: '@pisell/icon',
+              libraryDirectory: 'es',
+              camel2DashComponentName: false
+            },
+          ],
+        ]
+      });
+}
+
+const addWebpackBundleAnalyzer = (config) => {
+  config
+      .plugin('bundle-analyzer')
+      .use(BundleAnalyzerPlugin)
+      .end();
+
+}
+
 async function registerSetter(context, setterMap) {
   return Promise.all(Object.values(setterMap).map((setter) => installModule(context, setter)));
 }
@@ -361,7 +392,7 @@ async function build(options, pluginOptions, execCompile) {
     }),
   );
   const metaPathMap = {};
-  metaPaths.forEach((item) => {    
+  metaPaths.forEach((item) => {
     metaPathMap[path.basename(item).replace(path.extname(item), '')] = item;
     // metaPathMap[item.slice(item.lastIndexOf('/') + 1, item.lastIndexOf('.'))] = item;
   });
@@ -582,6 +613,8 @@ async function start(options, pluginOptions) {
 
     config.module.rule('svg').test(/\.svg$/).use('svgr').loader('@svgr/webpack').end().use('url-loader').loader('url-loader').end();
 
+    // addWebpackBundleAnalyzer(config);
+    // addBabelPluginImport(config);
     addPostCss(config);
     if (baseLibrary === 'rax') {
       config.module.rule('scss').use('rpx-loader').loader('rpx-loader').before('css-loader');
@@ -792,6 +825,8 @@ async function bundleMetaV2(options, pluginOptions, execCompile, metaType) {
 
     config.module.rule('svg').test(/\.svg$/).use('svgr').loader('@svgr/webpack').end().use('url-loader').loader('url-loader').end();
 
+    // addWebpackBundleAnalyzer(config);
+    // addBabelPluginImport(config);
     addPostCss(config);
   });
   return metaPath;
@@ -1004,6 +1039,8 @@ async function bundleEditorView(
 
     config.module.rule('svg').test(/\.svg$/).use('svgr').loader('@svgr/webpack').end().use('url-loader').loader('url-loader').end();
 
+    // addWebpackBundleAnalyzer(config);
+    // addBabelPluginImport(config);
     addPostCss(config);
 
     if (baseLibrary === 'rax') {
@@ -1094,6 +1131,8 @@ async function bundleRenderView(options, pluginOptions, platform, execCompile) {
 
     config.module.rule('svg').test(/\.svg$/).use('svgr').loader('@svgr/webpack').end().use('url-loader').loader('url-loader').end();
 
+    // addWebpackBundleAnalyzer(config);
+    addBabelPluginImport(config);
     addPostCss(config);
 
     if (baseLibrary === 'rax') {
@@ -1379,6 +1418,8 @@ async function bundleComponentMeta(webPackConfig, options, pluginOptions, execCo
 
         config.module.rule('svg').test(/\.svg$/).use('svgr').loader('@svgr/webpack').end().use('url-loader').loader('url-loader').end();
 
+        // addWebpackBundleAnalyzer(config);
+        // addBabelPluginImport(config);
         addPostCss(config);
       });
     })(component, idx);