vuepress2 中无法构建

[liziwl]

请确认

• [X] 我可以确认这个问题无法在 ECharts 项目本身中复现。

您是如何将 Vue-ECharts 引入项目的？

通过 ES 模块 import

版本信息

npm ls vue echarts vue-echarts 
sustech-online-ng@ C:\Users\liziq\WebstormProjects\sustech-online-ng
├─┬ @vuepress/plugin-docsearch@2.0.0-beta.51
│ ├─┬ @vuepress/client@2.0.0-beta.51
│ │ └── vue@3.2.37 deduped
│ ├─┬ @vuepress/core@2.0.0-beta.51
│ │ └── vue@3.2.37 deduped
│ ├─┬ vue-router@4.1.5
│ │ └── vue@3.2.37 deduped
│ └─┬ vue@3.2.37
│   └─┬ @vue/server-renderer@3.2.37
│     └── vue@3.2.37 deduped
├─┬ @vuepress/plugin-medium-zoom@2.0.0-beta.51
│ └── vue@3.2.37 deduped
├─┬ @vuepress/plugin-nprogress@2.0.0-beta.51
│ └── vue@3.2.37 deduped
├─┬ @vuepress/plugin-pwa-popup@2.0.0-beta.51
│ └── vue@3.2.37 deduped
├─┬ @vuepress/plugin-pwa@2.0.0-beta.51
│ └── vue@3.2.37 deduped
├─┬ @vuepress/plugin-toc@2.0.0-beta.51
│ └── vue@3.2.37 deduped
├─┬ echarts-for-react@3.0.2
│ └── echarts@5.3.3 deduped
├── echarts@5.3.3
├─┬ veaury@2.2.4
│ └─┬ @vitejs/plugin-vue@2.3.3
│   └── vue@3.2.37 deduped
├─┬ vue-echarts@6.2.3
│ ├── echarts@5.3.3 deduped
│ ├─┬ vue-demi@0.13.11
│ │ └── vue@3.2.37 deduped
│ └── vue@3.2.37 deduped
├─┬ vuepress-plugin-sitemap2@2.0.0-beta.99
│ └─┬ vuepress-shared@2.0.0-beta.99
│   └─┬ vue@3.2.39
│     └─┬ @vue/server-renderer@3.2.39
│       └── vue@3.2.39 deduped
└─┬ vuepress@2.0.0-beta.51
  └─┬ vuepress-vite@2.0.0-beta.51
    ├─┬ @vuepress/bundler-vite@2.0.0-beta.51
    │ ├─┬ @vitejs/plugin-vue@3.1.0
    │ │ └── vue@3.2.37 deduped
    │ └── vue@3.2.37 deduped
    ├─┬ @vuepress/theme-default@2.0.0-beta.51
    │ ├─┬ @vuepress/plugin-active-header-links@2.0.0-beta.51
    │ │ └── vue@3.2.37 deduped
    │ ├─┬ @vuepress/plugin-back-to-top@2.0.0-beta.51
    │ │ └── vue@3.2.37 deduped
    │ ├─┬ @vuepress/plugin-external-link-icon@2.0.0-beta.51
    │ │ └── vue@3.2.37 deduped
    │ ├─┬ @vuepress/plugin-theme-data@2.0.0-beta.51
    │ │ └── vue@3.2.37 deduped
    │ ├─┬ @vueuse/core@9.2.0
    │ │ └─┬ vue-demi@0.12.5
    │ │   └── vue@3.2.37 deduped
    │ └── vue@3.2.37 deduped
    └── vue@3.2.37 deduped

问题详情

在 vuepress2 项目中无法 build（yarn docs:fastbuild） 但是可以预览（yarn docs:dev）

预览页面：http://localhost:8080/transport/bustimer.html echart在文件 docs/.vuepress/components/BusChartVue.vue 里面引用

yarn docs:fastbuild              
yarn run v1.22.18
warning package.json: No license field
$ vuepress build docs
✔ Initializing and preparing data - done in 2.71s
⠸ Compiling with vite
(!) Some chunks are larger than 500 KiB after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/guide/en/#outputmanualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
✔ Compiling with vite - done in 18.93s
✖ Rendering 72 pages - failed in 466ms
file:///C:/Users/liziq/WebstormProjects/sustech-online-ng/docs/.vuepress/.temp/.server/app.faf4596e.mjs:14
import { CanvasRenderer } from "echarts/renderers.js";
         ^^^^^^^^^^^^^^
SyntaxError: Named export 'CanvasRenderer' not found. The requested module 'echarts/renderers.js' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'echarts/renderers.js';
const { CanvasRenderer } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:128:21)
    at async ModuleJob.run (node:internal/modules/esm/module_job:194:5)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:385:24)
    at async file:///C:/Users/liziq/WebstormProjects/sustech-online-ng/node_modules/@vuepress/bundler-vite/dist/index.js:406:30
    at async file:///C:/Users/liziq/WebstormProjects/sustech-online-ng/node_modules/@vuepress/utils/dist/index.js:98:20
    at async build (file:///C:/Users/liziq/WebstormProjects/sustech-online-ng/node_modules/@vuepress/bundler-vite/dist/index.js:394:3)
    at async file:///C:/Users/liziq/WebstormProjects/sustech-online-ng/node_modules/@vuepress/cli/dist/index.js:228:3
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

问题复现

https://github.com/SUSTech-CRA/sustech-online-ng/pull/121

[liziwl]

不知道为啥加上这几行就可以了 https://github.com/SUSTech-CRA/sustech-online-ng/pull/121/commits/f306bb8813e4bf917aca96814ea2a033d75748ec

[Justineo]

其实错误信息已经告诉你了，echarts/renderers 是一个 CommonJS 模块。这个不是 vue-echarts 的问题。