feat: import and build auspice as a part of webpack build

nextstrain · Jul 21, 2020 · 9d75bae · 9d75bae
1 parent 50e1761
commit 9d75bae
Show file tree

Hide file tree

Showing 9 changed files with 393 additions and 17,583 deletions.
diff --git a/packages/web/babel.config.js b/packages/web/babel.config.js
@@ -28,11 +28,20 @@ module.exports = (api) => {
           },
           // 'transform-runtime': {},
           // 'styled-jsx': {},
-          // 'class-properties': {},
+          // 'class-properties': { loose: true },
+          // 'preset-typescript': {
+          //   onlyRemoveTypeImports: true,
+          // },
         },
       ],
     ],
     plugins: [
+      ['@babel/plugin-proposal-decorators', { legacy: true }],
+      ['@babel/plugin-proposal-class-properties', { loose: true }],
+      'babel-plugin-parameter-decorator',
+      // ['@babel/plugin-proposal-decorators', { legacy: true }],
+      // '@babel/plugin-proposal-class-properties',
+      // 'babel-plugin-transform-typescript-metadata',
       '@babel/plugin-proposal-numeric-separator',
       'babel-plugin-styled-components',
       'babel-plugin-lodash',
@@ -49,7 +58,8 @@ module.exports = (api) => {
           root: [moduleRoot],
           removeImport: false,
           alias: {
-            src: path.join(moduleRoot, 'src'),
+            'src': path.join(moduleRoot, 'src'),
+            '@extensions': moduleRoot,
           },
         },
       ],

diff --git a/packages/web/config/next/next.config.ts b/packages/web/config/next/next.config.ts
@@ -1,5 +1,7 @@
 import path from 'path'
 
+import { uniq } from 'lodash'
+
 import type { NextConfig } from 'next'
 import getWithMDX from '@next/mdx'
 // import withBundleAnalyzer from '@zeit/next-bundle-analyzer'
@@ -24,6 +26,7 @@ import withRaw from './withRaw'
 import withSvg from './withSvg'
 import withImages from './withImages'
 import withThreads from './withThreads'
+import withoutNpmCss from './withoutNpmCss'
 // import withoutMinification from './withoutMinification'
 
 const {
@@ -109,22 +112,28 @@ const withTypeChecking = getWithTypeChecking({
   memoryLimit: 2048,
 })
 
-const withTranspileModules = getWithTranspileModules([
+const transpilationListDev = [
+  // prettier-ignore
+  'auspice',
+  'd3-scale',
+]
+
+const transpilationListProd = uniq([
+  ...transpilationListDev,
   '!d3-array/src/cumsum.js',
   '@loadable',
   'create-color',
   'd3-array',
-  'd3-scale',
   'debug',
   'delay',
   'immer',
+  'is-observable',
   'lodash',
   'observable-fns',
   'p-min-delay',
   'proper-url-join',
   'query-string',
   'react-router',
-  'is-observable',
   'react-share',
   'recharts',
   'redux-saga',
@@ -135,8 +144,11 @@ const withTranspileModules = getWithTranspileModules([
   'threads',
 ])
 
+const withTranspileModules = getWithTranspileModules(PRODUCTION ? transpilationListProd : transpilationListDev)
+
 const config = withPlugins(
   [
+    [withoutNpmCss],
     [withEnvironment],
     [withExtraWatch],
     [withThreads],
@@ -148,7 +160,7 @@ const config = withPlugins(
     [withMDX, { pageExtensions: ['js', 'jsx', 'ts', 'tsx', 'md', 'mdx'] }],
     [withLodash],
     [withTypeChecking],
-    PRODUCTION && [withTranspileModules],
+    [withTranspileModules],
     PRODUCTION && [withStaticComprression],
     // [withoutMinification],
   ].filter(Boolean),

diff --git a/packages/web/config/next/withoutNpmCss.ts b/packages/web/config/next/withoutNpmCss.ts
@@ -0,0 +1,30 @@
+import webpack from 'webpack'
+import type { NextConfig } from 'next'
+
+import { addWebpackPlugin } from './lib/addWebpackPlugin'
+
+export default function withoutNpmCss(nextConfig: NextConfig) {
+  let nextConfigNew = nextConfig
+  nextConfigNew = addWebpackPlugin(
+    nextConfigNew,
+
+    new webpack.ContextReplacementPlugin(/.*/, (context) => {
+      console.log({ context })
+    }),
+  )
+
+  nextConfigNew = addWebpackPlugin(
+    nextConfigNew,
+    new webpack.IgnorePlugin({
+      checkResource: (resource: string) => {
+        return (
+          resource.endsWith('awesomplete.css') ||
+          resource.includes('core-js/library') ||
+          resource.includes('babel-runtime')
+        )
+      },
+    }),
+  )
+
+  return nextConfigNew
+}
diff --git a/packages/web/package.json b/packages/web/package.json
@@ -61,6 +61,7 @@
     "@types/react-virtualized-auto-sizer": "1.0.0",
     "@types/react-window": "1.8.2",
     "animate.css": "4.1.0",
+    "auspice": "2.17.3",
     "autoprefixer": "9.8.5",
     "axios": "0.19.2",
     "bootstrap": "4.5.0",
@@ -95,6 +96,7 @@
     "react-i18next": "11.7.0",
     "react-icons": "3.10.0",
     "react-if": "3.4.3",
+    "react-no-ssr": "1.1.0",
     "react-redux": "7.2.0",
     "react-resize-detector": "5.0.6",
     "react-virtualized-auto-sizer": "1.0.2",
@@ -105,6 +107,7 @@
     "redux-persist": "6.0.0",
     "redux-saga": "1.1.3",
     "redux-saga-test-plan": "4.0.0-rc.3",
+    "reflect-metadata": "0.1.13",
     "regenerator-runtime": "0.13.5",
     "reselect": "4.0.0",
     "semver": "7.3.2",
@@ -120,15 +123,21 @@
   "devDependencies": {
     "@babel/core": "7.10.4",
     "@babel/node": "7.10.4",
+    "@babel/plugin-proposal-class-properties": "7.10.4",
+    "@babel/plugin-proposal-decorators": "7.10.4",
     "@babel/plugin-proposal-numeric-separator": "7.10.4",
+    "@babel/plugin-syntax-dynamic-import": "7.8.3",
     "@babel/plugin-transform-flow-strip-types": "7.10.4",
     "@babel/plugin-transform-modules-commonjs": "7.10.4",
     "@babel/plugin-transform-react-constant-elements": "7.10.4",
     "@babel/plugin-transform-react-inline-elements": "7.10.4",
     "@babel/plugin-transform-runtime": "7.10.4",
+    "@babel/preset-env": "7.10.4",
+    "@babel/preset-react": "7.10.4",
     "@babel/register": "7.10.4",
     "@babel/runtime": "7.10.4",
     "@babel/runtime-corejs3": "7.10.4",
+    "@extensions": "link:3rdparty/__empty-module",
     "@next/mdx": "9.4.4",
     "@nuxt/friendly-errors-webpack-plugin": "2.5.0",
     "@packtracker/webpack-plugin": "2.3.0",
@@ -158,6 +167,7 @@
     "@types/react": "16.9.43",
     "@types/react-dom": "16.9.8",
     "@types/react-helmet": "6.0.0",
+    "@types/react-no-ssr": "1.1.1",
     "@types/react-redux": "7.1.9",
     "@types/react-resize-detector": "4.2.0",
     "@types/react-router": "5.1.8",
@@ -179,10 +189,12 @@
     "babel-jest": "26.1.0",
     "babel-plugin-lodash": "3.3.4",
     "babel-plugin-module-resolver": "4.0.0",
+    "babel-plugin-parameter-decorator": "1.0.16",
     "babel-plugin-redux-saga": "1.1.2",
     "babel-plugin-smart-webpack-import": "1.7.0",
     "babel-plugin-styled-components": "1.10.7",
     "babel-plugin-transform-react-remove-prop-types": "0.4.24",
+    "babel-plugin-transform-typescript-metadata": "0.3.0",
     "babel-plugin-typescript-to-proptypes": "1.3.2",
     "codecov": "3.7.0",
     "compression-webpack-plugin": "4.0.0",
@@ -291,10 +303,43 @@
     "yaml-loader": "0.6.0"
   },
   "resolutions": {
+    "@babel/core": "7.10.4",
+    "@babel/node": "7.10.4",
+    "@babel/plugin-proposal-class-properties": "7.10.4",
+    "@babel/plugin-proposal-decorators": "7.10.4",
+    "@babel/plugin-proposal-numeric-separator": "7.10.4",
+    "@babel/plugin-syntax-dynamic-import": "7.8.3",
+    "@babel/plugin-transform-flow-strip-types": "7.10.4",
+    "@babel/plugin-transform-modules-commonjs": "7.10.4",
+    "@babel/plugin-transform-react-constant-elements": "7.10.4",
+    "@babel/plugin-transform-react-inline-elements": "7.10.4",
+    "@babel/plugin-transform-runtime": "7.10.4",
+    "@babel/preset-env": "7.10.4",
+    "@babel/preset-react": "7.10.4",
+    "@babel/register": "7.10.4",
+    "@babel/runtime": "7.10.4",
+    "@babel/runtime-corejs3": "7.10.4",
+    "@extensions": "link:3rdparty/__empty-module",
+    "babel-jest": "26.1.0",
+    "babel-plugin-lodash": "3.3.4",
+    "babel-plugin-module-resolver": "4.0.0",
+    "babel-plugin-redux-saga": "1.1.2",
+    "babel-plugin-smart-webpack-import": "1.7.0",
+    "babel-plugin-styled-components": "1.10.7",
+    "babel-plugin-transform-react-remove-prop-types": "0.4.24",
+    "babel-plugin-transform-typescript-metadata": "0.3.0",
+    "babel-plugin-typescript-to-proptypes": "1.3.2",
     "core-js": "3.6.5",
     "lodash": "4.17.19",
     "moment": "2.27.0",
+    "react": "16.13.1",
+    "react-dom": "16.13.1",
+    "react-error-boundary": "2.2.3",
+    "react-redux": "7.2.0",
+    "redux": "4.0.5",
+    "reflect-metadata": "0.1.13",
     "styled-components": "5.1.1",
-    "svgo": "1.3.2"
+    "svgo": "1.3.2",
+    "webpack": "4.43.0"
   }
 }