vbenjs / vite-plugin-theme

Vite plugin for dynamically changing the theme color of the interface
MIT License
141 stars 35 forks source link

Base配置CDN地址后,无法正常解析dark主题样式地址 #10

Open unclexiao opened 3 years ago

unclexiao commented 3 years ago

环境信息

node_modules依赖如下:

├─ ant-design-vue@2.2.8
├─ vite-plugin-theme@0.8.1
└─ vite@2.5.7

配置信息

.env.production文件如下:

VITE_PUBLIC_PATH = //remote-url/project/

编译后产物

dist/index.html编译结果

  <link disabled id=__VITE_PLUGIN_THEME-ANTD_DARK_THEME_LINK__ rel="alternate stylesheet"
    href=/remote-url/project/assets/app-antd-dark-theme-style.e3b0c442.css>

关键错误

无法正常解析远程地址,少了一个斜杠

原因分析

源码(src/antdDarkThemePlugin.ts)里拼接逻辑可能是有问题的,为什么要写死能本地路径?

      transformIndexHtml(html) {
        if (isServer || loadMethod !== 'link') {
          return html;
        }
        return {
          html,
          tags: [
            {
              tag: 'link',
              attrs: {
                disabled: true,
                id: linkID,
                rel: 'alternate stylesheet',
                href: path.posix.join(config.base, config.build.assetsDir, cssOutputName),
              },
              injectTo: 'body-prepend',
            },
          ],
        };
      },
unclexiao commented 3 years ago

预期应该是取配置好的base路径直接拼接,像这样://remote-url/project/assets/app-antd-dark-theme-style.e3b0c442.css,所以为什么要用path.posix,依赖包看不到src目录,我该如何修改呢?