build: fix demo build (apache#298)

* build: fix demo build * fix: version * build: add yarn.lock * fix: clean up webpack config
zhaoyongjie · Nov 17, 2021 · f6a1ac6 · f6a1ac6
1 parent 2b7ed84
commit f6a1ac6
Show file tree

Hide file tree

Showing 6 changed files with 17,276 additions and 36 deletions.
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/.gitignore b/superset-frontend/temporary_superset_ui/superset-ui/.gitignore
@@ -50,4 +50,5 @@ webpack.config.js
 # Lock files, libs should not have lock files
 npm-shrinkwrap.json
 package-lock.json
-yarn.lock
+# disable to provide more stability for the ci builds
+# yarn.lock
diff --git a/.../temporary_superset_ui/superset-ui/packages/superset-ui-demo/.storybook/webpack.config.js b/.../temporary_superset_ui/superset-ui/packages/superset-ui-demo/.storybook/webpack.config.js
@@ -1,20 +1,51 @@
+const path = require('path');
+
+const jsBabelPresets = [
+  ['@babel/preset-env', {
+    useBuiltIns: 'usage',
+    corejs: 3,
+    loose: true,
+    modules: false,
+    shippedProposals: true,
+    targets: false
+  }],
+  '@babel/preset-react',
+];
+
+const tsBabelPresets = jsBabelPresets.concat(['@babel/preset-typescript']);
+
+const babelPlugins = [
+  '@babel/plugin-proposal-object-rest-spread',
+  '@babel/plugin-proposal-class-properties',
+  '@babel/plugin-syntax-dynamic-import',
+  ["@babel/plugin-transform-runtime", { "corejs": 3 }]
+];
+
 module.exports = async ({ config }) => {
-  config.module.rules.push({
-    loader: require.resolve('babel-loader'),
+  const cacheDirectory = path.resolve('../../../node_modules/.cache/storybook');
+
+  // rule that applies to jsx? files
+  config.module.rules[0].use = {
+    loader: 'babel-loader',
     options: {
-      presets: [
-        ['@babel/preset-env', { useBuiltIns: 'entry' }],
-        '@babel/preset-react',
-        '@babel/preset-typescript',
-      ],
-      plugins: [
-        '@babel/plugin-proposal-object-rest-spread',
-        '@babel/plugin-proposal-class-properties',
-        '@babel/plugin-syntax-dynamic-import',
-      ],
-    },
+      cacheDirectory,
+      presets: jsBabelPresets,
+      plugins: babelPlugins,
+    }
+  };
+
+  // add rule for handling typescript
+  config.module.rules.push({
     test: /\.tsx?$/,
     exclude: /node_modules/,
+    use: {
+      loader: 'babel-loader',
+      options: {
+        cacheDirectory,
+        presets: tsBabelPresets,
+        plugins: babelPlugins,
+      }
+    },
   });
 
   config.resolve.extensions.push('.ts', '.tsx');

diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-demo/package.json b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-demo/package.json
@@ -29,7 +29,6 @@
   },
   "homepage": "https://github.com/apache-superset/superset-ui#readme",
   "dependencies": {
-    "@babel/polyfill": "^7.4.3",
     "@storybook/addon-actions": "^5.0.6",
     "@storybook/addon-knobs": "^5.2.3",
     "@storybook/addon-links": "^5.0.6",
@@ -38,22 +37,24 @@
     "@superset-ui/chart": "^0.12.6",
     "@superset-ui/color": "^0.12.5",
     "@superset-ui/connection": "^0.12.5",
-    "@superset-ui/legacy-plugin-chart-sankey": "^0.11.0",
-    "@superset-ui/legacy-plugin-chart-sunburst": "^0.11.0",
-    "@superset-ui/legacy-plugin-chart-word-cloud": "^0.11.0",
-    "@superset-ui/legacy-preset-chart-big-number": "^0.11.0",
+    "@superset-ui/legacy-plugin-chart-sankey": "^0.11.15",
+    "@superset-ui/legacy-plugin-chart-sunburst": "^0.11.15",
+    "@superset-ui/legacy-plugin-chart-word-cloud": "^0.11.15",
+    "@superset-ui/legacy-preset-chart-big-number": "^0.11.15",
     "@superset-ui/number-format": "^0.12.5",
-    "@superset-ui/plugin-chart-word-cloud": "^0.11.0",
+    "@superset-ui/plugin-chart-word-cloud": "^0.11.15",
     "@superset-ui/query": "^0.12.5",
     "@superset-ui/time-format": "^0.12.5",
     "@types/storybook__react": "4.0.2",
     "bootstrap": "^4.3.1",
+    "core-js": "3.6.4",
     "react": "^16.6.0",
     "storybook-addon-jsx": "^7.1.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.4.3",
-    "babel-loader": "^8.0.5",
-    "gh-pages": "^2.0.1"
+    "babel-loader": "^8.0.6",
+    "@babel/core": "^7.8.4",
+    "@babel/plugin-transform-runtime": "^7.8.3",
+    "gh-pages": "^2.2.0"
   }
 }
diff --git a/...nd/temporary_superset_ui/superset-ui/packages/superset-ui-demo/storybook/stories/index.js b/...nd/temporary_superset_ui/superset-ui/packages/superset-ui-demo/storybook/stories/index.js
@@ -1,4 +1,3 @@
-import '@babel/polyfill';
 import { setAddon, storiesOf } from '@storybook/react';
 import { withKnobs } from '@storybook/addon-knobs';
 import JSXAddon from 'storybook-addon-jsx';

diff --git a/...ackages/superset-ui-demo/storybook/stories/superset-ui-chart/ChartDataProviderStories.tsx b/...ackages/superset-ui-demo/storybook/stories/superset-ui-chart/ChartDataProviderStories.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { text, select } from '@storybook/addon-knobs';
 
-import { SuperChart, ChartDataProvider, ChartProps } from '@superset-ui/chart';
+import { SuperChart, ChartDataProvider } from '@superset-ui/chart';
 import { SupersetClient } from '@superset-ui/connection';
 import { BigNumberChartPlugin as LegacyBigNumberPlugin } from '@superset-ui/legacy-preset-chart-big-number';
 import LegacySankeyPlugin from '@superset-ui/legacy-plugin-chart-sankey';
@@ -68,18 +68,16 @@ export default [
                       <>
                         <SuperChart
                           chartType={visType}
-                          chartProps={
-                            new ChartProps({
-                              formData: payload.formData,
-                              height: Number(height),
-                              // @TODO fix typing
-                              // all vis's now expect objects but api/v1/ returns an array
-                              payload: Array.isArray(payload.queryData)
-                                ? payload.queryData[0]
-                                : payload.queryData,
-                              width: Number(width),
-                            })
+                          formData={payload.formData}
+                          height={Number(height)}
+                          // @TODO fix typing
+                          // all vis's now expect objects but api/v1/ returns an array
+                          queryData={
+                            Array.isArray(payload.queryData)
+                              ? payload.queryData[0]
+                              : payload.queryData
                           }
+                          width={Number(width)}
                         />
                         <br />
                         <Expandable expandableWhat="payload">