From ad20dcf8eaedfdf29e06bd166f172e9f681d553d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=84=E5=BF=83=E5=AE=87?= Date: Tue, 26 Dec 2023 17:27:28 +0800 Subject: [PATCH] test --- .babelrc | 17 ++- config/paths.js | 1 + config/webpack.server.js | 264 +++++++++++++++++++++++++++++++++++++-- package-lock.json | 55 ++++++-- package.json | 27 +--- server/index.js | 5 +- 6 files changed, 322 insertions(+), 47 deletions(-) diff --git a/.babelrc b/.babelrc index 09f1f3e18..44f77b1aa 100644 --- a/.babelrc +++ b/.babelrc @@ -2,9 +2,20 @@ "presets": [ "env", "react", - "stage-2" + "stage-2", + "es2015" ], - "plugins": [[ + "plugins": [["antd", { + "libraryDirectory": "lib", + "libraryName": "antd" + }],[ + "transform-imports", + { + "libraryName": "antd", + "libraryDirectory": "lib", + "camel2KebabCase": false + } + ],[ "transform-runtime", { "helpers": false, @@ -12,5 +23,5 @@ "regenerator": true, "moduleName": "babel-runtime" } - ],["transform-decorators-legacy"]] + ],["transform-decorators-legacy"], ["syntax-dynamic-import"], ["transform-class-properties"]] } \ No newline at end of file diff --git a/config/paths.js b/config/paths.js index eca9f3738..c116b362a 100644 --- a/config/paths.js +++ b/config/paths.js @@ -47,6 +47,7 @@ module.exports = { appIndexJs: resolveApp('src/index.js'), appPackageJson: resolveApp('package.json'), appSrc: resolveApp('src'), + serverSrc: resolveApp('server'), yarnLockFile: resolveApp('yarn.lock'), testsSetup: resolveApp('src/setupTests.js'), appNodeModules: resolveApp('node_modules'), diff --git a/config/webpack.server.js b/config/webpack.server.js index f250fa42e..75976f4b9 100644 --- a/config/webpack.server.js +++ b/config/webpack.server.js @@ -1,5 +1,25 @@ +const autoprefixer = require("autoprefixer"); const path = require("path"); -const nodeExternals = require("webpack-node-externals"); +const webpack = require("webpack"); +const HtmlWebpackPlugin = require("html-webpack-plugin"); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const ManifestPlugin = require("webpack-manifest-plugin"); +const InterpolateHtmlPlugin = require("react-dev-utils/InterpolateHtmlPlugin"); +const SWPrecacheWebpackPlugin = require("sw-precache-webpack-plugin"); +const eslintFormatter = require("react-dev-utils/eslintFormatter"); +const ModuleScopePlugin = require("react-dev-utils/ModuleScopePlugin"); +const MonacoWebpackPlugin = require("monaco-editor-webpack-plugin"); +const TerserJSPlugin = require("terser-webpack-plugin"); +const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin"); +const TerserWebpackPlugin = require('terser-webpack-plugin'); +const paths = require("./paths"); +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 serverConfig = { target:"node", //由于输出代码的运行环境是node，源码中依赖的node原生模块没必要打包进去；为了不把nodejs内置模块打包进输出文件中，例如： fs net模块等； @@ -9,20 +29,242 @@ const serverConfig = { filename:"bundle.js", path: path.resolve(__dirname,"../buildserver") }, - externals:[nodeExternals()], //为了不把node_modules目录下的第三方模块打包进输出文件中,因为nodejs默认会去node_modules目录下去寻找和使用第三方模块。 - module:{ - rules:[ + // externals:[nodeExternals()], //为了不把node_modules目录下的第三方模块打包进输出文件中,因为nodejs默认会去node_modules目录下去寻找和使用第三方模块。 + module: { + strictExportPresence: true, + rules: [ { - test: /\.js$/, - exclude: /node_modules/, - loader: "babel-loader", + test: /\.(js|jsx|mjs)$/, + enforce: "pre", + use: [ + { + options: { + formatter: eslintFormatter, + eslintPath: require.resolve("eslint"), + }, + loader: require.resolve("eslint-loader"), + }, + ], + include: [paths.appSrc, paths.serverSrc], }, { - test: /\.css$/, - use: ['style-loader', 'css-loader'], + // "oneOf" will traverse all following loaders until one will + // match the requirements. When no loader matches it will fall + // back to the "file" loader at the end of the loader list. + oneOf: [ + // "url" loader works just like "file" loader but it also embeds + // assets smaller than specified size as data URLs to avoid requests. + { + test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/], + loader: require.resolve("url-loader"), + options: { + limit: 10000, + name: "static/media/[name].[hash:8].[ext]", + }, + }, + { + test: /\.(js|jsx|mjs)$/, + include: [paths.appSrc, paths.serverSrc], + exclude: /node_modules/, + loader: require.resolve("babel-loader"), + options: { + compact: true, + plugins: [ + [ + "import", + { + libraryName: "antd", + libraryDirectory: "es", + style: true, + }, + ], + ], + }, + }, + { + test: /\.css$/, + use: [ + { + loader: MiniCssExtractPlugin.loader, + options: { + publicPath, + }, + }, + { + loader: require.resolve("css-loader"), + options: { + importLoaders: 1, + sourceMap: shouldUseSourceMap, + }, + }, + { + loader: require.resolve("postcss-loader"), + options: { + ident: "postcss", + plugins: () => [ + require("postcss-flexbugs-fixes"), + autoprefixer({ + browsers: [ + ">1%", + "last 4 versions", + "Firefox ESR", + "not ie < 9", // React doesn't support IE8 anyway + ], + flexbox: "no-2009", + }), + ], + }, + }, + ], + }, + { + test: /\.scss$/, + use: [ + { + loader: MiniCssExtractPlugin.loader, + options: { + publicPath, + }, + }, + { + loader: require.resolve("css-loader"), + options: { + importLoaders: 1, + sourceMap: shouldUseSourceMap, + }, + }, + { + loader: require.resolve("sass-loader"), + }, + { + loader: 'sass-resources-loader', + options: { + resources: ['src/global.scss'] + } + } + ], + }, + { + test: /\.less$/, + use: [{ + loader: 'isomorphic-style-loader', + }, { + loader: 'css-loader', // translates CSS into CommonJS + }, { + loader: 'less-loader', // compiles Less to CSS + options: { + modifyVars: { + 'primary-color': '#466aff', + 'link-color': '#466aff', + }, + javascriptEnabled: true, + }, + }] + }, + // "file" loader makes sure assets end up in the `build` folder. + // When you `import` an asset, you get its filename. + // This loader doesn't use a "test" so it will catch all modules + // that fall through the other loaders. + { + loader: require.resolve("file-loader"), + // Exclude `js` files to keep "css" loader working as it injects + // it's runtime that would otherwise processed through "file" loader. + // Also exclude `html` and `json` extensions so they get processed + // by webpacks internal loaders. + exclude: [/\.(js|jsx|mjs)$/, /\.html$/, /\.json$/], + options: { + name: "static/media/[name].[contenthash:8].[ext]", + }, + }, + // ** STOP ** Are you adding a new loader? + // Make sure to add the new loader(s) before the "file" loader. + ], }, - ] - } + ], + }, + 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