请求的模块 \'/node_modules/.vite/deps/vue.js\' 不提供名为 \'default\' 的导出

Question

以下是我的问题。 我通过库模式通过vite打包了我的项目。只要我的库包含任何第三方 UI 库（例如 vue-loading-overlay），就会发生错误。但是像 moment.js 这样的其他库就没有问题了。

这是我的vite.config.js，我的配置有问题吗？

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";

export default defineConfig({
  plugins: [vue()],
  build: {
    lib: {
      entry: resolve(__dirname, "src/lib.ts"),
      name: "my-ui-lib",
      fileName: "my-ui-lib",
    },
    rollupOptions: {
      external: ["vue"],
      output: [
        {
          format: "es",
          exports: "named",
          globals: { vue: "vue" },
        },
      ],
    },
  },
});

Answer 1

最后我解决了我的问题，在 vite.config.js 中添加以下内容。这个对我有用。

build: {

   /** If you set esmExternals to true, this plugins assumes that 
     all external dependencies are ES modules */

   commonjsOptions: {
      esmExternals: true 
   },
}

Answer 2

Original Answer

“Chart.js V3 是 treeshakable，所以你需要导入和注册所有东西，或者如果你想要你需要的一切，你可以从自动导入中导入图表，如下所示：

改变 import Chart from 'chart.js' 至 ->

import Chart from 'chart.js/auto';

有关导入和使用 chart.js 的不同方式的更多信息，您可以阅读文档中的集成页面。

由于您是从 Chart.js V2 升级，您可能还想阅读迁移指南，因为 V2 和 V3 之间有一些重大的重大变化”

Answer 3

/* Adding the following in vite.config.js. Just copy and paste all these code. It works for me. */

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";


// https://vitejs.dev/config/
export default defineConfig({
   plugins: [react()],
   commonjsOptions: {
      esmExternals: true,
   },
});

Answer 4

参考vuejs 3文档导入vue。