feat: using vite-plugin-style-import to import styles on demand

chungang1997 · May 3, 2021 · ef5ef0b · ef5ef0b
1 parent 73469c0
commit ef5ef0b
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 4 deletions.
diff --git a/vant/vite/package.json b/vant/vite/package.json
@@ -13,6 +13,7 @@
     "@vitejs/plugin-vue": "^1.2.2",
     "@vue/compiler-sfc": "^3.0.11",
     "less": "^4.1.1",
-    "vite": "^2.2.4"
+    "vite": "^2.2.4",
+    "vite-plugin-style-import": "^0.10.0"
   }
 }
diff --git a/vant/vite/src/main.js b/vant/vite/src/main.js
@@ -1,5 +1,4 @@
 import { createApp } from 'vue';
 import App from './App.vue';
-import 'vant/lib/index.css';
 
 createApp(App).mount('#app');
diff --git a/vant/vite/vite.config.js b/vant/vite/vite.config.js
@@ -1,5 +1,17 @@
-import vue from '@vitejs/plugin-vue';
+import vue from "@vitejs/plugin-vue";
+import styleImport from "vite-plugin-style-import";
 
 export default {
-  plugins: [vue()],
+  plugins: [
+    vue(),
+    styleImport({
+      libs: [
+        {
+          libraryName: "vant",
+          esModule: true,
+          resolveStyle: (name) => `vant/es/${name}/style`,
+        },
+      ],
+    }),
+  ],
 };