feat: support use alias in dynamic import

[caoxiemeihao]

Description

The PR improved from #7339

• Fewer code changes
• Compatible with the restriction of @rollup/plugin-dynamic-import-var

---

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• Read the Contributing Guidelines.
• Read the Pull Request Guidelines and follow the Commit Convention.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

[caoxiemeihao]

The PR just resolve vite serve phase alias adaptive. But will still be in vite build phase error.

After looking at the source code of importAnalysisBuild.ts, I found that buildImportAnalysisPlugin is executed after @rollup/plugin-dynamic-import-vars, but we need to resolve the alias before @rollup/plugin-dynamic-import-vars.
So we may need an additional plugin and put it in front of @rollup/plugin-dynamic-import-vars.

vite/packages/vite/src/node/plugins/importAnalysisBuild.ts

Line 86 in 7f8dc58

export function buildImportAnalysisPlugin(config: ResolvedConfig): Plugin {

export function resolveBuildPlugins(config: ResolvedConfig): {
  pre: Plugin[]
  post: Plugin[]
} {
  const options = config.build

  return {
    pre: [
      watchPackageDataPlugin(config),
      buildHtmlPlugin(config),
      commonjsPlugin(options.commonjsOptions),
      dataURIPlugin(),
      // 🚨 We may need to deal with alias before here
      // `@rollup/plugin-dynamic-import-vars`
      dynamicImportVars(options.dynamicImportVarsOptions),
      assetImportMetaUrlPlugin(config),
      ...(options.rollupOptions.plugins
        ? (options.rollupOptions.plugins.filter(Boolean) as Plugin[])
        : [])
    ],
    post: [
      buildImportAnalysisPlugin(config),
      buildEsbuildPlugin(config),
      ...(options.minify ? [terserPlugin(config)] : []),
      ...(options.manifest ? [manifestPlugin(config)] : []),
      ...(options.ssrManifest ? [ssrManifestPlugin(config)] : []),
      buildReporterPlugin(config),
      loadFallbackPlugin()
    ]
  }
}

[caoxiemeihao]

Not sure my idea is correct, I tried to write a plugin compatible with the use of alias.
In addition to supporting alias, it should be compatible with @rollup/plugin-dynamic-import-var as far as possible.
When the plugin is more stable, I hope to integrate it into Vite.
vite-plugin-dynamic-import

[caoxiemeihao]

@patak-dev Hey! 👋

I hope vite can support custom plugins sorting. For example, some plugins must run after the specified plugins.
Let's take vite-plguin-dynamic-import as an example. The plugin can only process JavaScript, so it must be run after @vitejs/plugin-vue

import { defineNuxtConfig } from 'nuxt3';
import dynamicImport from 'vite-plugin-dynamic-import';

// https://v3.nuxtjs.org/docs/directory-structure/nuxt.config
export default defineNuxtConfig({
  vite: {
    plugins: [
      dynamicImport(),
    ],
  },
});

I tried to reorder the plugins inside the plugin, but it didn't work!

{
  name: 'vite-plugin-dynamic-import',
  config(_config) {
    // Move "vite-plugin-dynamic-import" after "@vitejs/plugin-vue"
    // But it doesn't work
    _config.plugins = sortPlugin(_config.plugins);
    return _config;
  },
}

---

This may be changed through the configResolved hook, but it's "hack"!

{
  name: 'vite-plugin-dynamic-import',
  configResolved(_config) {
    _config.plugins.splice(targetIndex, 0, plugin);
  },
}

[poyoho]

repeat with #7756