無法從 Iconify 解析 .mjs 模塊。 Vue 3 cli 使用組合 api 和 typescript

Question

更新：在 iconify.mjs 文件修復中將： if(data.aliases?.[name2] !== void 0)更改為： if(data.aliases.= null && data.aliases[name2] !== void 0)錯誤，但是此檢查發生在很多地方，並且不可行。 知道為什么我不能解析這種類型的 null 運算符嗎？

在./node_modules/@iconify/vue/dist/iconify.mjs

Module parse failed: Unexpected token (99:21)You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders

我的代碼：

<template>
  <div>
    <Icon icon="mdi-light:home" />
  </div>
</template>
<script setup lang="ts">
import { Icon } from "@iconify/vue";
</script>

圖標化版本：

"@iconify/vue": "^3.2.0"

使用標准的 vue cli babel：

presets: ["@vue/cli-plugin-babel/preset"]

我試過：在 babel.config.js

module.exports = function override(config) {
  config.module.rules.push({
    test: /\.mjs$/,
    include: /node_modules/,
    type: "javascript/auto"
  });

  return config;
}

同樣的錯誤

我試圖刪除 .mjs 文件，強制它使用 regular.js 文件，這導致了同樣的錯誤，但缺少 .js 加載器。

我曾嘗試使用 Iconify SVG 框架，但我遇到了相同類型的錯誤，其中加載程序缺少 for.js 文件。

感謝您的任何反饋:)

解決方案：降級到這個版本的 Iconify "@iconify/vue": "^3.1.1"解決了這個問題。 然而，這導致了有關類型聲明的錯誤。 這是通過將 VS 代碼的 typescript 版本更改為： Use workspace version這是通過選擇 a.ts 文件然后按“shift+ctrl+p”和 select select typescript version的提示來完成的。

Answer 1

從存儲庫克隆並為 Vue 2 安裝依賴項時出現相同的錯誤https://github.com/iconify/iconify

Answer 2

解決方案：降級到這個版本的 Iconify "@iconify/vue": "^3.1.1"解決了這個問題。 然而，這導致了有關類型聲明的錯誤。 這是通過將 VS 代碼的 typescript 版本更改為： Use workspace version這是通過選擇 a.ts 文件然后按“shift+ctrl+p”和 select select typescript version的提示來完成的。