fix(dev): fix playground and docs alias (#4068)

* fix(dev): fix playground and docs alias

* refactor: reorder import

docs/vite.config.ts

@@ -8,11 +8,11 @@ const alias: Alias[] = []
 if (process.env.DOC_ENV !== 'production') {
   alias.push(
     {
-      find: /^element-plus$/,
+      find: /^element-plus(\/(es|lib))?$/,
       replacement: path.resolve(projRoot, 'packages/element-plus/index.ts'),
     },
     {
-      find: /^element-plus\/(es|lib)\/(.*)/,
+      find: /^element-plus\/(es|lib)\/(.*)$/,
       replacement: `${path.resolve(projRoot, 'packages')}/$2`,
     }
   )

play/package.json

@@ -2,7 +2,9 @@
   "name": "@element-plus/play",
   "private": true,
   "scripts": {
-    "dev": "vite"
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
   },
   "dependencies": {
     "@element-plus/icons": "^0.0.11",
@@ -10,6 +12,7 @@
     "vite": "^2.6.10"
   },
   "devDependencies": {
-    "unplugin-vue-components": "^0.16.0"
+    "unplugin-vue-components": "^0.16.0",
+    "vite-plugin-inspect": "^0.3.9"
   }
 }

play/vite.config.ts

@@ -3,30 +3,55 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import Components from 'unplugin-vue-components/vite'
 import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
+import Inspect from 'vite-plugin-inspect'
+import glob from 'fast-glob'
+import { epRoot, pkgRoot, projRoot } from '../build/utils/paths'
 import './vite.init'
-import { epRoot, pkgRoot } from '../build/utils/paths'
 
-export default defineConfig({
-  resolve: {
-    alias: [
-      {
-        find: /^element-plus$/,
-        replacement: path.resolve(epRoot, 'index.ts'),
-      },
-      {
-        find: /^element-plus\/(es|lib)\/(.*)$/,
-        replacement: `${pkgRoot}/$2`,
-      },
+export default defineConfig(async () => {
+  const optimizeDeps = (
+    await glob(['lodash/*.js', 'dayjs/(locale|plugin)/*.js'], {
+      cwd: path.resolve(projRoot, 'node_modules'),
+    })
+  ).map((dep) => dep.replace(/\.js$/, ''))
+
+  return {
+    resolve: {
+      alias: [
+        {
+          find: /^element-plus(\/(es|lib))?$/,
+          replacement: path.resolve(epRoot, 'index.ts'),
+        },
+        {
+          find: /^element-plus\/(es|lib)\/(.*)$/,
+          replacement: `${pkgRoot}/$2`,
+        },
+      ],
+    },
+    server: {
+      host: true,
+    },
+    plugins: [
+      vue(),
+      Components({
+        include: `${__dirname}/**`,
+        resolvers: ElementPlusResolver({ importStyle: 'sass' }),
+      }),
+      Inspect(),
     ],
-  },
-  server: {
-    host: true,
-  },
-  plugins: [
-    vue(),
-    Components({
-      include: `${__dirname}/**`,
-      resolvers: ElementPlusResolver({ importStyle: 'sass' }),
-    }),
-  ],
+
+    optimizeDeps: {
+      include: [
+        '@vue/shared',
+        '@vueuse/core',
+        'async-validator',
+        'memoize-one',
+        'normalize-wheel-es',
+        '@popperjs/core',
+        'dayjs',
+        '@element-plus/icons',
+        ...optimizeDeps,
+      ],
+    },
+  }
 })

pnpm-lock.yaml

@@ -249,12 +249,14 @@ importers:
       '@vitejs/plugin-vue': ^1.9.3
       unplugin-vue-components: ^0.16.0
       vite: ^2.6.10
+      vite-plugin-inspect: ^0.3.9
     dependencies:
       '@element-plus/icons': 0.0.11
       '@vitejs/plugin-vue': 1.9.3_vite@2.6.10
       vite: 2.6.10_sass@1.43.3
     devDependencies:
       unplugin-vue-components: 0.16.0_5526dbcc4fc39ff4d6a8525c3fd94908
+      vite-plugin-inspect: 0.3.9_vite@2.6.10
 
 packages:
 
@@ -2889,6 +2891,7 @@ packages:
 
   /bindings/1.5.0:
     resolution: {integrity: sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==}
+    requiresBuild: true
     dependencies:
       file-uri-to-path: 1.0.0
     dev: true
@@ -5012,6 +5015,7 @@ packages:
 
   /file-uri-to-path/1.0.0:
     resolution: {integrity: sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==}
+    requiresBuild: true
     dev: true
     optional: true
 
@@ -7606,6 +7610,7 @@ packages:
 
   /nan/2.14.2:
     resolution: {integrity: sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ==}
+    requiresBuild: true
     dev: true
     optional: true
 
@@ -10485,6 +10490,19 @@ packages:
       - supports-color
     dev: true
 
+  /vite-plugin-inspect/0.3.9_vite@2.6.10:
+    resolution: {integrity: sha512-iM4PQA76LHHKhePdsy/WjPczC+WNJedAm/ADUWv68sMJg+QOkgWzQiS+QkvfoulzDB7wmNPhKBP2lza1GubvMQ==}
+    peerDependencies:
+      vite: ^2.0.0
+    dependencies:
+      debug: 4.3.2
+      sirv: 1.0.17
+      ufo: 0.7.9
+      vite: 2.6.10_sass@1.43.3
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /vite/2.5.10:
     resolution: {integrity: sha512-0ObiHTi5AHyXdJcvZ67HMsDgVpjT5RehvVKv6+Q0jFZ7zDI28PF5zK9mYz2avxdA+4iJMdwCz6wnGNnn4WX5Gg==}
     engines: {node: '>=12.2.0'}