Unable to use @vitejs/plugin-legacy

[ericasun]

Related plugins

• plugin-vue

• plugin-vue-jsx

Describe the bug

Describe the bug

There is no problem before adding @vitejs/plugin-legacy.
I want the open the compiled file index.html directly in the dist directory, but it was blank page.
So I added @vitejs/plugin-legacy and made relevant configurations in vite.config.ts.
Then compile.
Or you can tell me how to configure it. Open the compiled file index.html directly to display the content.

step

1. yarn install
2. yarn build

error:

yarn run v1.22.22
warning package.json: No license field
$ vite build
plugin-legacy overrode 'build.target'. You should pass 'targets' as an option to this plugin with the list of legacy browsers to support instead.
vite v2.5.10 building for production...
✓ 91 modules transformed.
[vite:legacy-post-process] Cannot destructure property 'chunks' of 'undefined' as it is undefined.
error during build:
TypeError: Cannot destructure property 'chunks' of 'undefined' as it is undefined.
    at Object.renderChunk (/Users/erica/Desktop/01前端/01项目/08goal-Vue3-wheel(暂时)/node_modules/@vitejs/plugin-legacy/dist/index.cjs:430:43)
    at /Users/erica/Desktop/01前端/01项目/08goal-Vue3-wheel(暂时)/node_modules/rollup/dist/shared/rollup.js:22879:40
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

package.json

{
  "name": "stui-vue",
  "version": "0.0.4",
  "scripts": {
    "build": "vite build",
    "build-html": "vite build && node update-index.mjs",
    "lint": "vue-cli-service lint",
    "dev": "vite",
    "preview": "vite preview"
  },
  "main": "dist/lib/stui.js",
  "module": "dist/lib/stui.esm.js",
  "files": [
    "dist/lib/*"
  ],
  "dependencies": {
    "@vitejs/plugin-legacy": "^6.0.0",
    "@vitejs/plugin-vue": "^1.4.0",
    "esbuild": "^0.6.0",
    "fast-glob": "^3.2.11",
    "github-markdown-css": "4.0.0",
    "marked": "1.1.1",
    "prismjs": "^1.28.0",
    "rollup": "^2.0.0",
    "vue": "^3.2.25",
    "vue-router": "4.0.0-beta.3"
  },
  "devDependencies": {
    "@rollup/plugin-alias": "^3.1.9",
    "@vue/cli-plugin-eslint": "~4.5.13",
    "@vue/eslint-config-standard": "^5.1.2",
    "eslint": "^6.7.2",
    "eslint-plugin-import": "^2.20.2",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-standard": "^4.0.0",
    "eslint-plugin-vue": "^7.0.0",
    "rollup-plugin-esbuild": "2.5.0",
    "rollup-plugin-scss": "2.6.0",
    "rollup-plugin-terser": "7.0.2",
    "rollup-plugin-vue": "6.0.0-beta.10",
    "sass": "1.32.11",
    "vite": "2.5.10",
    "vite-plugin-svg-icons": "^2.0.1"
  },
  "resolutions": {
    "node-sass": "npm:sass@1.26.11"
  },
  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
}

vite.config.ts

// @ts-nocheck
import { md } from "./plugins/vite-plugin-vue-md";
import demo from "./plugins/vite-plugin-vue-demo";
import {defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import {createSvgIconsPlugin} from 'vite-plugin-svg-icons';
import path from 'path';
import legacy from '@vitejs/plugin-legacy';

export default defineConfig({
  base: './',
  // assetsDir: 'assets',
  plugins: [
    md(), 
    vue(),
    demo,
    createSvgIconsPlugin({
      // 指定要缓存的图标文件夹
      iconDirs: [path.resolve(process.cwd(), 'src/lib/Basic/Icon/svg')],
      // 执行icon name的格式
      symbolId: 'icon-[name]',
    }),
    legacy({
      targets: ['defaults', 'not IE 11']
    })
  ],
  resolve:{
    alias:{
      '@' : path.resolve(__dirname, 'src'),
      "components": path.resolve(__dirname, "src/components"),
      "lib": path.resolve(__dirname, "src/lib")
    }
  },
  build: {

    // Template for index.html
    index: path.resolve(__dirname, "./dist/index.html"),
    // Paths
    assetsRoot: path.resolve(__dirname, "./dist"),
    assetsSubDirectory: "static",
    assetsPublicPath: "./", //此处为修改的地方，这里加.
    target: ['es2015', 'chrome63'],
  },
});

Reproduction

https://github.com/ericasun/problemhere

Steps to reproduce

1. yarn install
2. yarn build

System Info

System:
    OS: Mac
  Binaries:
    Node: v17.9.1  - /usr/local/bin/node
    Yarn: 1.22.15 - /usr/local/bin/yarn
    npm: 8.11.0 - /usr/local/bin/npm
  Browsers:
    chorme: 131.0.6778.265

Used Package Manager

yarn

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.