Vite Ruby迁移：如何让依赖使用window.jQuery而非Yarn版本？

• 背景：我正在将基于Rails的项目从Webpacker & Webpack迁移到Vite 3 + Vite Ruby。由于项目是CMS系统，部分老客户直接在页面<head>的<script>标签中编写了jQuery代码，这些代码无法轻易修改。

• 最初的尝试与问题：我原本想通过以下代码导入jQuery并挂载到window对象：

import jQuery from 'jquery'
window.$ = window.jQuery = jQuery

但Vite生成的脚本默认是type="module"，存在延迟加载特性，导致<head>中的客户自定义jQuery代码执行时，Vite导入的jQuery还未完成初始化。无奈之下，我改用CDN的<script>标签同步加载jQuery。

• jstree插件的冲突问题：引入jstree插件时遇到了新问题——该插件会自动加载node_modules中的jQuery，并将自身挂载到这个本地版本的jQuery上。但我们业务代码中调用$(element).jstree()时，使用的是window上的CDN版jQuery，因此会出现找不到jstree方法的错误。

• 临时方案的弊端：如果提前import $ from 'jquery'再导入jstree，虽然能解决方法找不到的问题，但会导致用户重复下载两份jQuery（CDN版+本地包），增加加载负担。

• 期望的解决方案：我希望让所有依赖包在导入'jquery'时，都直接使用window上的CDN版本。尝试过配置Rollup的external选项，但没有效果。目前只能退而求其次用CDN加载jstree，这个方案不够优雅。

我尝试过的Vite配置如下：

import { defineConfig } from 'vite'
import RubyPlugin from 'vite-plugin-ruby'

export default defineConfig({
  plugins: [
    RubyPlugin(),
  ],
  server: {
    hmr: {
      host: 'vitedevserver.test',
      clientPort: 443
    }
  },
  build: {
    rollupOptions: {
      external: ['jquery'],
      output: {
        globals: {
          jquery: '$'
        }
      }
    }
  }
})

内容的提问来源于stack exchange，提问作者Brendon Muir