docs: revert to lazy field approach for deferred plugin loading

Vite does not support functions or async factories in the plugins
array, so there is no native way to truly lazy-load plugins. Revert
the troubleshooting docs and snap test to use the vite-plus lazy field.

Author: fengmk2

docs/config/troubleshooting.md

@@ -6,30 +6,36 @@ Use this page when your Vite+ configuration is not behaving the way you expect.
 
 When `vite.config.ts` imports heavy plugins at the top level, every `import` is evaluated eagerly, even for commands like `vp lint` or `vp fmt` that don't need those plugins. This can make config loading noticeably slow.
 
-Vite supports promises in the `plugins` array, so you can use dynamic `import()` to defer heavy plugin loading:
+Use the `lazy` field in `defineConfig` to defer heavy plugin loading. Plugins provided through `lazy` are only resolved when Vite actually needs them:
 
 ```ts
 import { defineConfig } from 'vite-plus';
 
 export default defineConfig({
-  plugins: [
-    import('vite-plugin-heavy').then((m) => m.default()),
-  ],
+  lazy: async () => {
+    const { default: heavyPlugin } = await import('vite-plugin-heavy');
+    return { plugins: [heavyPlugin()] };
+  },
 });
 ```
 
-This way the plugin module is only loaded when Vite actually resolves plugins, keeping config loading fast for commands that don't need them.
-
-You can mix regular plugins with deferred ones. Lightweight plugins stay inline while expensive ones use dynamic `import()`:
+You can keep lightweight plugins inline and defer only the expensive ones. Plugins from `lazy` are appended after existing plugins:
 
 ```ts
 import { defineConfig } from 'vite-plus';
 import lightPlugin from 'vite-plugin-light';
 
 export default defineConfig({
-  plugins: [
-    lightPlugin(),
-    import('vite-plugin-heavy').then((m) => m.default()),
-  ],
+  plugins: [lightPlugin()],
+  lazy: async () => {
+    const { default: heavyPlugin } = await import('vite-plugin-heavy');
+    return { plugins: [heavyPlugin()] };
+  },
 });
 ```
+
+The resulting plugin order is: `[lightPlugin(), heavyPlugin()]`.
+
+::: info
+The `lazy` field is a Vite+ extension. We plan to support this in upstream Vite in the future.
+:::

packages/cli/snap-tests/lazy-loading-plugins/snap.txt

@@ -1,4 +1,4 @@
-> # Test that lazy-loaded plugins via dynamic import are applied during build
+> # Test that plugins loaded via lazy field are applied during build
 > vp build
 > cat dist/index.html | grep 'lazy-plugin-injected'
   <!-- lazy-plugin-injected --></body>

packages/cli/snap-tests/lazy-loading-plugins/steps.json

@@ -1,6 +1,6 @@
 {
   "commands": [
-    "# Test that lazy-loaded plugins via dynamic import are applied during build",
+    "# Test that plugins loaded via lazy field are applied during build",
     {
       "command": "vp build",
       "ignoreOutput": true

packages/cli/snap-tests/lazy-loading-plugins/vite.config.ts

@@ -1,5 +1,8 @@
 import { defineConfig } from 'vite-plus';
 
 export default defineConfig({
-  plugins: [import('./my-plugin').then((m) => m.default())],
+  lazy: async () => {
+    const { default: myLazyPlugin } = await import('./my-plugin');
+    return { plugins: [myLazyPlugin()] };
+  },
 });