fix: 修复设置extraCSS为false时关闭压缩css错误 (#193)

* feat: mini-css-extract-plugin支持配置

* fix: 修复设置extraCSS为false时关闭压缩css错误

packages/fes-builder-webpack/src/plugins/common/webpackConfig/css.js

@@ -101,6 +101,9 @@ export default function createCssWebpackConfig({ isDev, config, webpackConfig, b
                 config.extraCSS?.plugin ?? {},
             ),
         ]);
+    }
+
+    if (!isDev) {
         webpackConfig.optimization.minimizer('css').use(require.resolve('css-minimizer-webpack-plugin'), [{}]);
     }
 

packages/fes-builder-webpack/types.d.ts

@@ -1,30 +1,30 @@
-import Config from 'webpack-5-chain'
+import Config from 'webpack-5-chain';
 import webpack from 'webpack';
-import HtmlWebpackPlugin from 'html-webpack-plugin'
+import HtmlWebpackPlugin from 'html-webpack-plugin';
-import { LoaderOptions, PluginOptions } from 'mini-css-extract-plugin'
+import { LoaderOptions, PluginOptions } from 'mini-css-extract-plugin';
 
 interface CopyFileType {
     from: string;
     to: string;
 }
 
-declare module "@fesjs/fes" {
+declare module '@fesjs/fes' {
     interface PluginBuildConfig {
         analyze?: {
             analyzerMode?: 'server' | 'static' | 'disabled';
             analyzerHost?: string;
             analyzerPort?: number | 'auto';
             openAnalyzer?: boolean;
-            generateStatsFile?:  boolean;
+            generateStatsFile?: boolean;
             statsFilename?: string;
             logLevel?: 'info' | 'warn' | 'error' | 'silent';
-            defaultSizes?: 'stat' | 'parsed' | 'gzip'
+            defaultSizes?: 'stat' | 'parsed' | 'gzip';
         };
-        chainWebpack?: (memo: Config, args: {env: string, webpack: typeof webpack}) => void;
+        chainWebpack?: (memo: Config, args: { env: string; webpack: typeof webpack }) => void;
         copy?: CopyFileType | CopyFileType[];
         cssLoader?: {
             url?: boolean | ((url: string, resourcePath: string) => boolean);
-            import?: boolean | ({ filter: (url: string, media: string, resourcePath: string) => boolean });
+            import?: boolean | { filter: (url: string, media: string, resourcePath: string) => boolean };
             modules?: boolean | string | object;
             sourceMap?: boolean;
             importLoaders?: number;
@@ -51,13 +51,13 @@ declare module "@fesjs/fes" {
         html?: HtmlWebpackPlugin.Options;
         lessLoader?: Record<string, any>;
         nodeModulesTransform?: {
-            exclude: string[]
+            exclude: string[];
         };
         postcssLoader?: Record<string, any>;
         vueLoader?: object;
         extraCSS?: {
-            loader?: LoaderOptions,
+            loader?: LoaderOptions;
-            plugin?: PluginOptions
+            plugin?: PluginOptions;
         };
     }
 }

packages/fes-template-vite/.fes.js

@@ -1,7 +1,7 @@
 import { defineBuildConfig } from '@fesjs/fes';
 
 export default defineBuildConfig({
-    builder: 'vite',
+    builder: 'webpack',
     define: {
         __DEV__: false,
     },

packages/fes-template-vite/.fes.local.js

@@ -1,7 +1,7 @@
-import { defineBuildConfig } from "@fesjs/fes";
+import { defineBuildConfig } from '@fesjs/fes';
 
-export default {
+export default defineBuildConfig({
     // define: {
     //     __DEV__: true
     // },
-}
+});

packages/fes-template/.fes.js

@@ -1,7 +1,6 @@
 import { defineBuildConfig } from '@fesjs/fes';
 
 export default defineBuildConfig({
-    swc: false,
     targets: {
         chrome: '78',
     },
@@ -89,5 +88,4 @@ export default defineBuildConfig({
     monacoEditor: {
         languages: ['javascript', 'typescript', 'html', 'json'],
     },
-    presets: [require.resolve('../fes-builder-webpack/lib')],
 });

packages/fes-template/.fes.local.js

@@ -1,5 +1,7 @@
-export default {
+import { defineBuildConfig } from '@fesjs/fes';
+
+export default defineBuildConfig({
     // define: {
     //     __DEV__: true
     // },
-};
+});

packages/fes-template/.fes.prod.js

@@ -1,7 +1,7 @@
-// .fes.js 只负责管理编译时配置，只能使用plain Object
 import path from 'path';
+import { defineBuildConfig } from '@fesjs/fes';
 
-export default {
+export default defineBuildConfig({
     // publicPath: 'https://gw.alipayobjects.com/',
     // 配置 mini-css-extract-plugin
     extraCSS: {
@@ -9,4 +9,4 @@ export default {
             publicPath: (resourcePath, context) => `${path.relative(path.dirname(resourcePath), context)}/`,
         },
     },
-};
+});

packages/fes-template/package.json

@@ -45,6 +45,7 @@
   },
   "dependencies": {
     "@fesjs/fes": "workspace:*",
+    "@fesjs/builder-webpack": "workspace:*",
     "@fesjs/plugin-login": "workspace:*",
     "@fesjs/plugin-access": "workspace:*",
     "@fesjs/plugin-enums": "workspace:*",

pnpm-lock.yaml

@@ -750,6 +750,9 @@ importers:
 
   packages/fes-template:
     dependencies:
+      '@fesjs/builder-webpack':
+        specifier: workspace:*
+        version: link:../fes-builder-webpack
       '@fesjs/fes':
         specifier: workspace:*
         version: link:../fes
@@ -4541,6 +4544,7 @@ packages:
 
   /@vuepress/shared@2.0.0-beta.50-pre.1:
     resolution: {integrity: sha512-Gk6ikIV2V8LMokc+H/juH+kBOigo38Woup42Q2pmmWqmlwdLqbUcCYZSt/z+opeOUAqC9s3CZnKR8xCw+qo8BQ==}
+    deprecated: deprecated
     dependencies:
       '@vue/shared': 3.2.47
     dev: false