highlight.js 编译失败

[jim3ma]

首先感谢作者的无私奉献。

请教一下关于如何加载 highlight.js

      modules: [
        'vue',
        'highlight.js',
      ...

错误日志：

vite-plugin-cdn2: highlight.js try resolve file failed.

[nonzzz]

参考 highlight.js. 同时你需要自己手动指定highlight.js的globalName.因为这个包十分怪异。同时你也需要指定relativeModule字段随你自己的想法来。然后为了保险起见得在transform这个hook里面手动调整为正确的cdn地址。

[jim3ma]

第一次用，对 globalName 和 relativeModule 不是很理解， transform 有看到例子

[nonzzz]

modules:[ {name:'highlight.js',global:'hljs',relativeModule:''} ]

[jim3ma]

modules:[ {name:'highlight.js',global:'hljs',relativeModule:''} ]

我看 https://github.com/nonzzz/vite-plugin-cdn/issues/30 里的 relativeModule 是：

          { name: 'pinia', relativeModule: './dist/pinia.iife.prod.js'  },
          { name: 'vue-i18n', relativeModule: './dist/vue-i18n.global.prod.js' },
          { name: 'sortablejs', global: 'Sortablejs', relativeModule: './Sortable.min.js' }

relativeModule 是打包好的 js 么？highlight.js 里没有类似打包好的 js

[nonzzz]

@jim3ma relativeModule 有2个用处一个是当包没提供对应umd或者iife模块的时候读取这个地址然后推测globalName。然后作为cdn地址加入到html里面。这里要传入任意relativeModule是因为highlight.js并没有提供。但是插件是需要依据包有没有umd或者iife模块进行进一步判断。因此你同时需要在transform这个hook里面拿到highlight.js相关的url。并且重写他们

[jim3ma]

好的，非常感谢，我大概理解了，去尝试一下

[nonzzz]

具体可以参照 scanner.ts 和 inject.ts。 因为从我的角度来看如果一个库不提供iife或者umd包的话他是无法进行external的除非使用esm的importMap。但是目前我觉得importMap还存在很多不足所以是这么实现的

[jim3ma]

确实如此，没有提供 iife 和 umd 不好搞