build: upgrade vite (#102)

IDuxFE · Jan 3, 2021 · 063b4cb · 063b4cb
1 parent 0e57621
commit 063b4cb
Show file tree

Hide file tree

Showing 8 changed files with 24 additions and 40 deletions.
diff --git a/index.html b/index.html
diff --git a/package.json b/package.json
@@ -40,6 +40,7 @@
     "@types/yaml-front-matter": "^4.1.0",
     "@typescript-eslint/eslint-plugin": "^4.8.0",
     "@typescript-eslint/parser": "^4.8.0",
+    "@vitejs/plugin-vue": "^1.0.0",
     "@vue/babel-plugin-jsx": "^1.0.0",
     "@vue/compiler-sfc": "^3.0.0",
     "@vue/eslint-config-prettier": "^6.0.0",
@@ -82,8 +83,8 @@
     "ts-node": "^9.1.0",
     "tslib": "^2.0.0",
     "typescript": "^4.1.0",
-    "vite": "^1.0.0-rc.13",
-    "vue": "^3.0.0",
+    "vite": "^v2.0.0-beta.2",
+    "vue": "^3.0.5",
     "vue-jest": "^5.0.0-alpha.7",
     "vue-router": "^4.0.0",
     "vue-types": "^3.0.0",

diff --git a/packages/components/icon/demo/Basic.vue b/packages/components/icon/demo/Basic.vue
@@ -21,8 +21,7 @@ export default defineComponent({
 
     // 动态加载：不会被打包，可以减小包体积，需要加载的时候时候 http 请求加载
     const loadIconDynamically = (iconName: string) => {
-      // TODO： fix with vite
-      return fetch(`site/docs/src/assets/icon-svg/${iconName}.svg`).then(res => res.text())
+      return fetch(`/icon-svg/${iconName}.svg`).then(res => res.text())
     }
     useGlobalConfig('icon', { loadIconDynamically })
 

diff --git a/scripts/gulp/buildConfig.ts b/scripts/gulp/buildConfig.ts
@@ -24,7 +24,7 @@ export const buildConfig: BuildConfig = {
   packageRoot,
   docsDir,
   siteDir,
-  siteIconAssetsDir: join(siteDir, 'docs/src/assets/icon-svg'),
+  siteIconAssetsDir: join(siteDir, 'docs/public/icon-svg'),
   outputDir: join(outputRoot, 'dist'),
   publishDir: join(outputRoot, 'publish'),
   libDir: join(outputRoot, 'lib'),

diff --git a/scripts/gulp/site/_site/docs/index.html b/scripts/gulp/site/_site/docs/index.html
@@ -2,12 +2,12 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
-  <link rel="icon" href="./favicon.ico" />
+  <link rel="icon" href="/favicon.ico" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Vite App</title>
 </head>
 <body>
   <div id="app"></div>
-  <script type="module" src="./src/main.js"></script>
+  <script type="module" src="./src/main.ts"></script>
 </body>
 </html>
diff --git a/scripts/gulp/site/_site/docs/src/App.vue b/scripts/gulp/site/_site/docs/src/App.vue
@@ -30,8 +30,7 @@ export default defineComponent({
   setup() {
     // 动态加载：不会被打包，可以减小包体积，需要加载的时候时候 http 请求加载
     const loadIconDynamically = (iconName: string) => {
-      // TODO： fix with vite
-      return fetch(`site/docs/src/assets/icon-svg/${iconName}.svg`).then(res => res.text())
+      return fetch(`/icon-svg/${iconName}.svg`).then(res => res.text())
     }
     useGlobalConfig('icon', { loadIconDynamically })
 

diff --git a/scripts/gulp/site/_site/docs/src/header/Logo.vue b/scripts/gulp/site/_site/docs/src/header/Logo.vue
@@ -1,6 +1,6 @@
 <template>
   <a href="/" class="logo">
-    <img width="40" height="40" alt="logo" src="./assets/logo.png" />
+    <img width="40" height="40" alt="logo" src="../assets/logo.png" />
     <strong>@IDUX</strong>
   </a>
 </template>
diff --git a/vite.config.ts b/vite.config.ts
@@ -1,23 +1,21 @@
-import { UserConfig } from 'vite'
+import { defineConfig } from 'vite'
+import vuePlugin from '@vitejs/plugin-vue'
+import path from 'path'
 
-const config: UserConfig = {
-  entry: './site/docs/index.html', // not work
-  base: './site/docs/', // not work
-  resolvers: [
+export default defineConfig({
+  root: './site/docs/',
+  plugins: [vuePlugin()],
+  alias: [
     {
-      alias(path: string): string {
-        if (path.startsWith('@idux')) {
-          return path.replace('@idux', '/packages')
-        }
-        return path
-      },
+      find: '@idux',
+      replacement: path.resolve(__dirname, 'packages'),
     },
   ],
-  cssPreprocessOptions: {
-    less: {
-      javascriptEnabled: true,
+  css: {
+    preprocessorOptions: {
+      less: {
+        javascriptEnabled: true,
+      },
     },
   },
-}
-
-export default config
+})