fix: 修复esm编译

.env

@@ -5,7 +5,7 @@ PROXY=/Cityinterface:http://192.168.12.116:8015;/PandaOMS:http://192.168.12.116:
 # PROXY2 = test : http://localhost:8006/
 
 # 本地应用启动的host域名
-HOST = 192.168.12.192
+HOST = 127.0.0.1
 
 # 本地应用启动的端口
  PORT = 3001

babel.config.js

@@ -3,16 +3,39 @@ module.exports = {
     [
       '@babel/preset-env',
       {
-        modules: false,
+        'exclude': [
+          'transform-typeof-symbol',
+          'transform-unicode-regex',
+          'transform-sticky-regex',
+          'transform-new-target',
+          'transform-modules-umd',
+          'transform-modules-systemjs',
+          'transform-modules-amd',
+          'transform-literals',
+        ],
+        'modules': false,
       },
     ],
-    '@babel/preset-react',
+    ['@babel/preset-typescript'],
+    ['@babel/preset-react'],
   ],
   plugins: [
     'styled-components',
-    '@babel/plugin-proposal-class-properties',
+    ['@babel/plugin-proposal-optional-chaining', { 'loose': false }],
+    ['@babel/plugin-proposal-nullish-coalescing-operator', { 'loose': false }],
+    '@babel/plugin-syntax-top-level-await',
+    ['@babel/plugin-transform-destructuring', { 'loose': false }],
+    ['@babel/plugin-proposal-decorators', { 'legacy': true }],
+    ['@babel/plugin-proposal-class-properties', { 'loose': true }],
+    '@babel/plugin-proposal-export-default-from',
+    ['@babel/plugin-proposal-pipeline-operator', { 'proposal': 'minimal' }],
+    '@babel/plugin-proposal-do-expressions',
+    '@babel/plugin-proposal-function-bind',
+    '@babel/plugin-proposal-logical-assignment-operators',
     '@babel/plugin-syntax-dynamic-import',
-    ['import', { libraryName: 'antd', style: true }],
+    ['babel-plugin-transform-react-remove-prop-types', { 'removeImport': true }],
+    ['babel-plugin-react-require'],
+    ['babel-plugin-import', { 'libraryName': 'antd', 'libraryDirectory': 'es', 'style': true }, 'antd'],
   ],
   env: {
     production: {
@@ -21,14 +44,14 @@ module.exports = {
         'lodash',
         'transform-react-remove-prop-types',
         '@babel/plugin-transform-react-inline-elements',
-        '@babel/plugin-transform-react-constant-elements',
+        '@babel/plugin-transform-react-constant-elements'
       ],
     },
+    development: {
+      plugins: ['react-refresh/babel']
+    },
     test: {
-      plugins: [
-        '@babel/plugin-transform-modules-commonjs',
-        'dynamic-import-node',
-      ],
+      plugins: ['@babel/plugin-transform-modules-commonjs', 'dynamic-import-node']
     },
   },
 };

internals/webpack/webpack.base.babel.js

@@ -3,6 +3,8 @@ const webpack = require('webpack');
 const slash = require('slash2');
 const CopyPlugin = require('copy-webpack-plugin');
 const cesiumSource = './node_modules/cesium/Build/Cesium';
+const FastRefreshPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
+const nodeLibs = require('node-libs-browser');
 console.log();
 module.exports = options => ({
   mode: options.mode,
@@ -22,10 +24,6 @@ module.exports = options => ({
     // 允许Cesium兼容 webpack的require方式
     toUrlUndefined: true,
   },
-  node: {
-    // 解决fs模块的问题（Resolve node module use of fs）
-    fs: 'empty',
-  },
   module: {
     rules: [
       {
@@ -33,11 +31,11 @@ module.exports = options => ({
         exclude: /node_modules/,
         use: {
           loader: 'babel-loader',
-          // options: options.babelQuery,
-          options: {
-            presets: ['@babel/preset-typescript'],
-            plugins: ['@babel/plugin-proposal-optional-chaining'],
-          },
+          options: options.babelQuery,
+          // options: {
+          //   presets: ['@babel/preset-typescript'],
+          //   plugins: ['@babel/plugin-proposal-optional-chaining'],
+          // },
         },
       },
       {
@@ -178,6 +176,12 @@ module.exports = options => ({
       NODE_ENV: 'development',
     }),
 
+    new webpack.ProvidePlugin({
+      process: nodeLibs.process
+    }),
+    new FastRefreshPlugin({
+      overlay: false
+    }),
     new CopyPlugin([
       {
         from: path.resolve(process.cwd(), './public'),
@@ -212,6 +216,19 @@ module.exports = options => ({
       '@': path.resolve(process.cwd(), './src'),
       components: path.resolve(process.cwd(), './src/components'),
       cesium: path.resolve(process.cwd(), cesiumSource),
+      react: path.resolve(process.cwd(), './node_modules/react'),
+    },
+    fallback: {
+      ...Object.keys(nodeLibs).reduce((memo, key) => {
+        if (nodeLibs[key]) {
+          memo[key] = nodeLibs[key];
+        } else {
+          memo[key] = false;
+        }
+        return memo;
+      }, {}),
+      http: false,
+      https: false,
     },
   },
   devtool: options.devtool,

internals/webpack/webpack.dev.babel.js

@@ -36,10 +36,10 @@ module.exports = require('./webpack.base.babel')({
       inject: true, // Inject all files that are generated by webpack, e.g. bundle.js
       template: 'src/index.html',
     }),
-    new CircularDependencyPlugin({
-      exclude: /a\.js|node_modules/, // exclude node_modules
-      failOnError: false, // show a warning when there is a circular dependency
-    }),
+    // new CircularDependencyPlugin({
+    //   exclude: /a\.js|node_modules/, // exclude node_modules
+    //   failOnError: false, // show a warning when there is a circular dependency
+    // }),
   ],
   devtool: 'cheap-module-source-map',
   node: {

server/middlewares/addDevMiddlewares.js

@@ -6,9 +6,9 @@ const { addProxyMiddleware } = require('../proxy');
 
 function createWebpackMiddleware(compiler, publicPath) {
   return webpackDevMiddleware(compiler, {
-    logLevel: 'warn',
+    // logLevel: 'warn',
     publicPath,
-    silent: true,
+    // silent: true,
     stats: 'errors-only',
   });
 }
@@ -25,7 +25,7 @@ module.exports = function addDevMiddlewares(app, webpackConfig) {
   addProxyMiddleware(app);
   // Since webpackDevMiddleware uses memory-fs internally to store build
   // artifacts, we use it instead
-  const fs = middleware.fileSystem;
+  const fs = middleware.context.outputFileSystem;
 
   app.get('*', (_req, res) => {
     fs.readFile(path.join(compiler.outputPath, 'index.html'), (err, file) => {

src/app.js

+/* eslint-disable */
 import '!file-loader?name=[name].[ext]!./images/favicon.ico';
 import './global.less';
 import '@babel/polyfill';
@@ -7,15 +8,13 @@ import 'sanitize.css/sanitize.css';
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-
+import { ArcGISMap as MapComponent } from '@wisdom-map/arcgismap';
 import { ConfigProvider } from 'antd';
 import zhCN from 'antd/es/locale/zh_CN';
 import { ConnectedRouter } from 'connected-react-router/immutable';
 import Immutable from 'immutable';
 import { Provider } from 'react-redux';
 
-import { PictureWallProvider } from '@/components/Upload/context';
-
 import configureStore from './configureStore';
 import App from './containers/App';
 import config from './routes/config';
@@ -25,30 +24,30 @@ const initialState = Immutable.Map();
 const store = configureStore(initialState, history);
 const MOUNT_NODE = document.getElementById('app');
 const render = () => {
-  ReactDOM.render(
-    <Provider store={store}>
-      <ConnectedRouter history={history}>
-        <ConfigProvider locale={zhCN}>
-          {/* <PictureWallProvider> */}
-          <App routesConfig={config} />
-          {/* </PictureWallProvider> */}
-        </ConfigProvider>
-      </ConnectedRouter>
-    </Provider>,
-    MOUNT_NODE,
-  );
+    ReactDOM.render(
+      <Provider store = { store }>
+        <ConnectedRouter history = { history }>
+          <ConfigProvider locale = { zhCN } >
+            { /* <PictureWallProvider> */ }
+            <App routesConfig = { config }/>
+            { /* </PictureWallProvider> */ }
+          </ConfigProvider>
+          </ConnectedRouter>
+        </Provider>,
+        MOUNT_NODE,
+    );
 };
 
 if (module.hot) {
-  module.hot.accept(['./containers/App'], () => {
-    ReactDOM.unmountComponentAtNode(MOUNT_NODE);
-    render();
-  });
+    module.hot.accept(['./containers/App'], () => {
+        ReactDOM.unmountComponentAtNode(MOUNT_NODE);
+        render();
+    });
 }
 if (MOUNT_NODE) {
-  render();
+    render();
 }
 
 if (process.env.NODE_ENV === 'production') {
-  require('offline-plugin/runtime').install(); // eslint-disable-line global-require
+    require('offline-plugin/runtime').install(); // eslint-disable-line global-require
 }