feat: windicss

docs/.vuepress/configs/sidebar/en.ts

@@ -61,6 +61,7 @@ export const en: SidebarConfig = {
         '/reference/plugin/plugins/request.md',
         '/reference/plugin/plugins/vuex.md',
         '/reference/plugin/plugins/qiankun.md',
+        '/reference/plugin/plugins/windicss.md',
         '/reference/plugin/plugins/sass.md',
         '/reference/plugin/plugins/editor.md',
       ],

docs/.vuepress/configs/sidebar/zh.ts

@@ -61,6 +61,7 @@ export const zh: SidebarConfig = {
         '/zh/reference/plugin/plugins/request.md',
         '/zh/reference/plugin/plugins/vuex.md',
         '/zh/reference/plugin/plugins/qiankun.md',
+        '/zh/reference/plugin/plugins/windicss.md',
         '/zh/reference/plugin/plugins/sass.md',
         '/zh/reference/plugin/plugins/editor.md',
       ],

docs/reference/plugin/plugins/windicss.md

@@ -0,0 +1,28 @@
+# @fesjs/plugin-windicss
+
+
+## 介绍
+
+`windicss` 支持
+
+## 启用方式
+在 `package.json` 中引入依赖：
+```json
+{
+    "devDependencies": {
+        "@fesjs/plugin-windicss": "^2.0.0"
+    },
+}
+```
+
+## 配置
+
+在 `.fes.js` 配置文件中添加自定义配置，详细配置[请看](https://windicss.org/integrations/webpack.html)：
+
+```
+{
+    windicss: {
+        root: './',
+    }
+}
+```

docs/zh/reference/plugin/plugins/windicss.md

@@ -0,0 +1,28 @@
+# @fesjs/plugin-windicss
+
+
+## 介绍
+
+`windicss` 支持
+
+## 启用方式
+在 `package.json` 中引入依赖：
+```json
+{
+    "devDependencies": {
+        "@fesjs/plugin-windicss": "^2.0.0"
+    },
+}
+```
+
+## 配置
+
+在 `.fes.js` 配置文件中添加自定义配置，详细配置[请看](https://windicss.org/integrations/webpack.html)：
+
+```js
+export default {
+    windicss: {
+        root: './',
+    }
+}
+```

packages/fes-plugin-windicss/src/index.js

@@ -1,9 +1,11 @@
 
 import WindiCSSWebpackPlugin from 'windicss-webpack-plugin';
+import { resolve } from 'path';
+
 
 export default (api) => {
     api.describe({
-        key: 'windi',
+        key: 'windicss',
         config: {
             default: {}
         }
@@ -12,7 +14,12 @@ export default (api) => {
     api.addEntryImportsAhead(() => [{ source: 'windi.css' }]);
 
     api.chainWebpack((memo) => {
-        memo.plugin('windicss').before('vue-loader-plugin').use(WindiCSSWebpackPlugin);
+        memo.plugin('windicss').before('vue-loader-plugin').use(WindiCSSWebpackPlugin, [
+            {
+                config: resolve(__dirname, '../windi.config.js'),
+                ...api.config.windicss
+            }
+        ]);
         return memo;
     });
 };

packages/fes-template/src/pages/index.vue

@@ -2,7 +2,7 @@
     <div :class="$style.red">
         <a-input placeholder="请输入。。。" />
         <a-button type="primary">Primary</a-button>
-        <div>国际化 {{t("test")}}</div>
+        <div class="m-2">国际化 {{t("test")}}</div>
         fes & 拉夫德鲁 <br />
         <access :id="accessId"> accessOnepicess1 <input /> </access>
         <div v-access="accessId"> accessOnepicess2 <input /> </div>
@@ -29,10 +29,7 @@ import { Button, Input } from 'ant-design-vue';
 export default {
     components: {
         [Button.name]: Button,
-        [Input.name]: Input,
-    },
-    mounted(){
-        console.log("$style:", this.$style)
+        [Input.name]: Input
     },
     setup() {
         const fes = ref('fes upgrade to vue3');
@@ -129,6 +126,9 @@ export default {
             enumsGet: enums.get,
             roles
         };
+    },
+    mounted() {
+        console.log('$style:', this.$style);
     }
 };
 </script>