diff --git a/.babelrc b/.babelrc
index 44f77b1aa..09b166a7a 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1,27 +1,28 @@
{
"presets": [
- "env",
- "react",
- "stage-2",
- "es2015"
+ // 移除 "es2015" 预设，因为它已经被 "env" 预设覆盖
+ ["@babel/preset-env" ],
+ "@babel/preset-react" // 使用新的插件命名
],
- "plugins": [["antd", {
- "libraryDirectory": "lib",
- "libraryName": "antd"
- }],[
- "transform-imports",
- {
- "libraryName": "antd",
- "libraryDirectory": "lib",
- "camel2KebabCase": false
- }
- ],[
- "transform-runtime",
- {
- "helpers": false,
- "polyfill": false,
- "regenerator": true,
- "moduleName": "babel-runtime"
- }
- ],["transform-decorators-legacy"], ["syntax-dynamic-import"], ["transform-class-properties"]]
+ "plugins": [
+ ["import", { "libraryName": "antd", "libraryDirectory": "lib"}],
+ // 使用新的插件命名
+ ["@babel/plugin-transform-runtime", {
+ "corejs": 3,
+ "helpers": true,
+ "regenerator": true,
+ "useESModules": false
+ }],
+ ["@babel/plugin-proposal-decorators", {
+ "legacy": true
+ }],
+ ["@babel/plugin-syntax-dynamic-import"],
+ ["@babel/plugin-transform-class-properties"], // 使用新的插件命名
+ "@babel/plugin-syntax-import-meta",
+ "@babel/plugin-proposal-json-strings",
+ "@babel/plugin-proposal-function-sent",
+ "@babel/plugin-proposal-export-namespace-from",
+ "@babel/plugin-proposal-numeric-separator",
+ "@babel/plugin-proposal-throw-expressions"
+ ]
}
\ No newline at end of file
diff --git a/Routes.js b/Routes.js
index 9d8a6c929..2c5b685a4 100644
--- a/Routes.js
+++ b/Routes.js
@@ -8,4 +8,4 @@ export default [
exact: true,
component: Detail,
},
-];
+];
\ No newline at end of file
diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js
index e95cffd11..712ddd82c 100644
--- a/config/webpack.config.dev.js
+++ b/config/webpack.config.dev.js
@@ -273,12 +273,11 @@ module.exports = {
reactPath:'react.production.min.js',
}),
new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw),
-
// Add module names to factory functions so they appear in browser profiler.
new webpack.NamedModulesPlugin(),
// Makes some environment variables available to the JS code, for example:
// if (process.env.NODE_ENV === 'development') { ... }. See `./env.js`.
- new webpack.DefinePlugin(env.stringified),
+ new webpack.DefinePlugin({ ...env.stringified, __SERVER__: 'false',__CLIENT__: 'true' }),
// This is necessary to emit hot updates (currently CSS only):
new webpack.HotModuleReplacementPlugin(),
// Watcher doesn't work well if you mistype casing in a path so we use
diff --git a/config/webpack.config.prod.js b/config/webpack.config.prod.js
index e441901ba..62e5e54b9 100644
--- a/config/webpack.config.prod.js
+++ b/config/webpack.config.prod.js
@@ -16,8 +16,9 @@ const TerserWebpackPlugin = require('terser-webpack-plugin');
const paths = require("./paths");
const getClientEnvironment = require("./env");
-let publicPath = "/react/build/";
+let publicPath = "/build/";
const publicUrl = publicPath.slice(0, -1);
+
// const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== "false";
const shouldUseSourceMap = process.env.NODE_ENV !== "production";
const env = getClientEnvironment(publicPath,'production.min');
@@ -294,12 +295,12 @@ module.exports = {
minifyURLs: true,
},
}),
+ new webpack.DefinePlugin({ ...env.stringified, __SERVER__: 'false',__CLIENT__: 'true' }),
new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw),
// Makes some environment variables available to the JS code, for example:
// if (process.env.NODE_ENV === 'production') { ... }. See `./env.js`.
// It is absolutely essential that NODE_ENV was set to production here.
// Otherwise React will be compiled in the very slow development mode.
- new webpack.DefinePlugin(env.stringified),
new MiniCssExtractPlugin({
filename: "static/css/[name].[contenthash:8].css",
diff --git a/config/webpack.server.js b/config/webpack.server.js
index 75976f4b9..403d42d93 100644
--- a/config/webpack.server.js
+++ b/config/webpack.server.js
@@ -18,8 +18,8 @@ const getClientEnvironment = require("./env");
let publicPath = "/react/buildserver/";
// const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== "false";
const shouldUseSourceMap = true;
-const env = getClientEnvironment(publicPath,'production.min');
-// const nodeExternals = require("webpack-node-externals");
+const env = getClientEnvironment(publicPath,'development');
+const nodeExternals = require("webpack-node-externals");
const serverConfig = {
target:"node", //由于输出代码的运行环境是node，源码中依赖的node原生模块没必要打包进去；为了不把nodejs内置模块打包进输出文件中，例如： fs net模块等；
@@ -29,7 +29,43 @@ const serverConfig = {
filename:"bundle.js",
path: path.resolve(__dirname,"../buildserver")
},
- // externals:[nodeExternals()], //为了不把node_modules目录下的第三方模块打包进输出文件中,因为nodejs默认会去node_modules目录下去寻找和使用第三方模块。
+ externals: [
+ nodeExternals(), // 忽略 Node.js 核心模块
+ // 自定义的外部模块
+ { 'alex': 'Alex', "react": "React", "react-dom": "ReactDOM" }
+ ],
+ resolve: {
+ // This allows you to set a fallback for where Webpack should look for modules.
+ // We placed these paths second because we want `node_modules` to "win"
+ // if there are any conflicts. This matches Node resolution mechanism.
+ // https://github.com/facebookincubator/create-react-app/issues/253
+ modules: ["node_modules", paths.appNodeModules].concat(
+ // It is guaranteed to exist because we tweak it in `env.js`
+ process.env.NODE_PATH.split(path.delimiter).filter(Boolean)
+ ),
+ // These are the reasonable defaults supported by the Node ecosystem.
+ // We also include JSX as a common component filename extension to support
+ // some tools, although we do not recommend using it, see:
+ // https://github.com/facebookincubator/create-react-app/issues/290
+ // `web` extension prefixes have been added for better support
+ // for React Native Web.
+ extensions: [".web.js", ".mjs", ".js", ".json", ".web.jsx", ".jsx"],
+ alias: {
+ educoder: __dirname + "/../src/common/educoder.js",
+ // Support React Native Web
+ // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
+ "react-native": "react-native-web",
+ },
+ plugins: [
+ // Prevents users from importing files from outside of src/ (or node_modules/).
+ // This often causes confusion because we only process files within src/ with babel.
+ // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
+ // please link the files into your node_modules/ and let module-resolution kick in.
+ // Make sure your source files are compiled, as they will not be processed in any way.
+ new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
+ // ["transform-remove-console"]
+ ],
+ },
module: {
strictExportPresence: true,
rules: [
@@ -66,20 +102,23 @@ const serverConfig = {
test: /\.(js|jsx|mjs)$/,
include: [paths.appSrc, paths.serverSrc],
exclude: /node_modules/,
- loader: require.resolve("babel-loader"),
+ loader: "babel-loader",
options: {
- compact: true,
- plugins: [
- [
- "import",
- {
- libraryName: "antd",
- libraryDirectory: "es",
- style: true,
- },
- ],
+ cacheDirectory: true,
+ presets: [
+ require.resolve('@babel/preset-env'),
+ require.resolve('@babel/preset-react'),
],
- },
+ plugins: [
+ require.resolve('@babel/plugin-transform-async-to-generator'),
+ require.resolve('@babel/plugin-syntax-dynamic-import'),
+ require.resolve('@babel/plugin-proposal-class-properties'),
+ require.resolve('@babel/plugin-proposal-export-default-from'),
+ require.resolve('@babel/plugin-transform-runtime'),
+ require.resolve('@babel/plugin-transform-modules-commonjs'),
+ require.resolve('babel-plugin-dynamic-import-webpack'),
+ ]
+ }
},
{
test: /\.css$/,
@@ -183,80 +222,14 @@ const serverConfig = {
],
},
plugins: [
- // Makes some environment variables available in index.html.
- // The public URL is available as %PUBLIC_URL% in index.html, e.g.:
- //
- // In production, it will be an empty string unless you specify "homepage"
- // in `package.json`, in which case it will be the pathname of that URL.
- // Generates an `index.html` file with the