feat: use style replace css file

aotuzuche · Oct 15, 2020 · b011df2 · b011df2
1 parent 48b6a1b
commit b011df2
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 17 deletions.
diff --git a/bin/webpack/baseConfig.js b/bin/webpack/baseConfig.js
@@ -2,7 +2,7 @@ const fs = require('fs')
 const webpack = require('webpack')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const FriendlyErrorsWebpackPlugin = require('friendly-errors-webpack-plugin')
-const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+// const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin')
 const { merge } = require('webpack-merge')
 const { ModuleFederationPlugin } = require('webpack').container
@@ -18,9 +18,11 @@ const getBaseConfig = async () => {
   const deps = require(resolveProjectPath('package.json')).dependencies
   const styleRules = [
     {
-      loader: MiniCssExtractPlugin.loader,
+      loader: 'style-loader',
       options: {
         esModule: false,
+        injectType: 'singletonStyleTag',
+        attributes: { id: `${APP_CONFIG.syscode}Style` },
       },
     },
     {
@@ -126,15 +128,15 @@ const getBaseConfig = async () => {
       }),
 
       // 提取公共样式
-      new MiniCssExtractPlugin({
-        filename: isDev
-          ? `css/${APP_CONFIG.syscode}.[name].css`
-          : `css/${APP_CONFIG.syscode}.[name].[contenthash:7].css`,
-        chunkFilename: isDev
-          ? `css/${APP_CONFIG.syscode}.[id].css`
-          : `css/${APP_CONFIG.syscode}.[id].[contenthash:7].css`,
-        ignoreOrder: true,
-      }),
+      // new MiniCssExtractPlugin({
+      //   filename: isDev
+      //     ? `css/${APP_CONFIG.syscode}.[name].css`
+      //     : `css/${APP_CONFIG.syscode}.[name].[contenthash:7].css`,
+      //   chunkFilename: isDev
+      //     ? `css/${APP_CONFIG.syscode}.[id].css`
+      //     : `css/${APP_CONFIG.syscode}.[id].[contenthash:7].css`,
+      //   ignoreOrder: true,
+      // }),
 
       // 美化本地开发时的终端界面
       new FriendlyErrorsWebpackPlugin({
@@ -151,7 +153,7 @@ const getBaseConfig = async () => {
           name: APP_CONFIG.syscode,
           // library: { type: 'var', name: APP_CONFIG.syscode },
           remotes: {
-            layout: `layout@${APP_CONFIG.layout || '/'}system/layout/remoteEntry.js`,
+            layout: `layout@${APP_CONFIG.layout || '/system/layout/'}remoteEntry.js`,
           },
           filename: 'remoteEntry.js',
           exposes: {

diff --git a/package.json b/package.json
@@ -42,7 +42,7 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@babel/core": "^7.11.5",
+    "@babel/core": "^7.12.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.4.2",
     "address": "^1.1.2",
     "autoprefixer": "^10.0.1",
@@ -51,7 +51,7 @@
     "chalk": "^4.1.0",
     "cliui": "^7.0.1",
     "commander": "^6.1.0",
-    "css-loader": "^4.3.0",
+    "css-loader": "^5.0.0",
     "deepmerge": "^4.2.2",
     "download-git-repo": "^3.0.2",
     "ejs": "^3.1.5",
@@ -81,11 +81,11 @@
     "sass-loader": "^10.0.3",
     "source-map-url": "^0.4.0",
     "style-loader": "^2.0.0",
-    "terser-webpack-plugin": "^4.2.3",
+    "terser-webpack-plugin": "^5.0.0",
     "thread-loader": "^3.0.0",
-    "ts-loader": "^8.0.4",
+    "ts-loader": "^8.0.5",
     "url-loader": "^4.1.1",
-    "webpack": "^5.0.0",
+    "webpack": "^5.1.0",
     "webpack-bundle-analyzer": "^3.9.0",
     "webpack-cli": "^4.0.0",
     "webpack-dev-server": "^3.11.0",