{"full_name":"PanJiaChen/vue-element-admin","owner":"PanJiaChen","name":"vue-element-admin","url":"https://github.com/PanJiaChen/vue-element-admin","description":":tada: A magical vue admin                                                                https://panjiachen.github.io/vue-element-admin","homepage":"","topics":[],"language":"Vue","license":"MIT","avatar":"https://avatars.githubusercontent.com/u/8121621?u=4789e0163407a88c30a80b2fda7ed87d403370ef&v=4","created_at":"2017-04-17T03:35:49Z","pushed_at":"2024-10-24T11:25:46Z","metrics":{"stars":90109,"forks":30209,"watchers":2151,"issues":3607,"prs":637,"releases":49,"issues_open":null,"issues_closed":null,"prs_open":null,"prs_closed":null,"prs_merged":null,"discussions":15},"growth":{"day":{"stars":-4,"forks":-3,"base_day":"2026-11-09"}},"history":{"dates":["2026-11-09","2026-11-10"],"stars":[90113,90109],"forks":[30212,30209],"watchers":[2151,2151],"issues_open":[null,null],"prs_open":[null,null]},"boards":{"total":187},"same_owner":[],"issues":[{"number":439,"title":"点击切换路由的时候，有时候会报错，Error: Loading chunk 1 failed.     at HTMLScriptElement.d (bootstrap 7d5ba07478b35f182b62:103)","comments":74,"created_at":"2018-01-30T15:53:40Z"},{"number":602,"title":"请问有讨论组或者群吗？","comments":47,"created_at":"2018-04-16T09:30:43Z"},{"number":3526,"title":"用最新的框架，打包出来element的字体图标乱码了？","comments":43,"created_at":"2020-12-02T03:31:11Z"},{"number":2312,"title":"Projects using vue-element-admin","comments":43,"created_at":"2019-07-01T15:10:43Z"},{"number":2593,"title":"动态路由如何实现懒加载？","comments":42,"created_at":"2019-09-23T01:33:52Z"},{"number":1177,"title":"keep-alive三级目录下的问题","comments":36,"created_at":"2018-10-10T03:13:46Z"},{"number":406,"title":"多级路由嵌套 keep-alive 失效","comments":34,"created_at":"2018-01-18T06:34:14Z"},{"number":3480,"title":"JSON_PAGE_FORMAT of null <anonymous>","comments":33,"created_at":"2020-10-28T13:24:05Z"}],"discussions":[{"number":4251,"title":"迁移至rsbuild.    migrate vue-element-admin from vuecli to rsbuild","comments":0,"category":"Show and tell","created_at":"2024-08-30T07:01:59Z"},{"number":4206,"title":"寻找主页","comments":1,"category":"General","created_at":"2023-11-15T11:49:00Z"},{"number":4195,"title":"How to use sticky for table header?","comments":0,"category":"Q&A","created_at":"2023-09-12T07:54:50Z"},{"number":4151,"title":"I want to change my layout theme","comments":2,"category":"Q&A","created_at":"2023-04-17T09:00:16Z"},{"number":4147,"title":"why 'import path from path' can use in web project ?","comments":0,"category":"Q&A","created_at":"2023-03-15T05:07:13Z"},{"number":4104,"title":"request headers always been set by program default","comments":1,"category":"Q&A","created_at":"2022-11-29T18:02:29Z"},{"number":4095,"title":"启动报错","comments":1,"category":"General","created_at":"2022-11-09T10:03:15Z"},{"number":4089,"title":"renderHeader的表头数据变化时，表头不会重新渲染问题的解决方法","comments":1,"category":"Show and tell","created_at":"2022-10-24T10:31:37Z"}],"latest_release":{"name":"4.4.0 Update to vue-cli@4","tag":"4.4.0","published_at":"2020-06-21T13:42:12Z","body":"在新版本中将原来的 `vue-cli@3` 升级为 `vue-cli@4`。\r\n主要是为了解决：\r\n\r\n- `npm run dev` 会自动开两个 tab https://github.com/PanJiaChen/vue-element-admin/issues/2944\r\n- `npm run build:prod` 页面白屏的问题 https://github.com/PanJiaChen/vue-element-admin/issues/3271\r\n\r\n`vue-cli` 升级也非常简单，基本无需自己操作说明， 可参照 https://cli.vuejs.org/migrating-from-v3/\r\n\r\n1. 安装 最新版本`@vue/cli`\r\n\r\n```bash\r\nnpm install -g @vue/cli\r\n# OR\r\nyarn global add @vue/cli\r\n```\r\n\r\n2. 然后执行\r\n\r\n```bash\r\nvue upgrade\r\n```\r\n\r\n脚本就会自动帮你进行升级\r\n\r\n## :warning: Breaking Changes\r\n\r\n**有一点需要额外注意，在新版本中废弃了通过`VUE_CLI_BABEL_TRANSPILE_MODULES`来控制懒加载**\r\n\r\n### 废弃原因\r\n\r\n在`vue-cli@3`时代，使用`VUE_CLI_BABEL_TRANSPILE_MODULES`是 ok 的，但其实也是脆弱的，就比如在`vue-cli@4`时，vue-cli 引入`babel-plugin-dynamic-import-node`的逻辑就发生了变化，需要`VUE_CLI_BABEL_TRANSPILE_MODULES`和`VUE_CLI_BABEL_TARGET_NODE`同时为 true 时才会生效，所以只要 vue-cli 的判断逻辑发生了变化，我们都需要做相对应的改动，或非常被动和耦合。所以我们在`vue-cli@4`版本中，不再通过`VUE_CLI_BABEL_TRANSPILE_MODULES:true`来设置，而是通过手动引入`'babel-plugin-dynamic-import-node'`的方式，具体见下一部分。\r\n\r\n### vue-cli@4\r\n\r\n1. 在 `.env.development`文件中不在需要配置`VUE_CLI_BABEL_TRANSPILE_MODULES = true`，删除即可。\r\n\r\n2. 在命令行执行 `npm install babel-plugin-dynamic-import-node -S -D`\r\n\r\n3. 在`babel.config.js` 中添加插件\r\n\r\n```js\r\nmodule.exports = {\r\n  presets: ['@vue/cli-plugin-babel/preset'],\r\n  env: {\r\n    development: {\r\n      plugins: ['dynamic-import-node']\r\n    }\r\n  }\r\n}\r\n```\r\n\r\n具体 commit：https://github.com/PanJiaChen/vue-element-admin/pull/3028/commits/2ea998f91d889480821468de86df9bf8defbb5f0\r\n\r\n\r\n\r\n---------\r\n\r\n\r\n\r\nUpgrade the original `vue-cli @ 3` to `vue-cli @ 4` in the new version.\r\nMainly to solve:\r\n\r\n-`npm run dev` will automatically open two tags https://github.com/PanJiaChen/vue-element-admin/issues/2944 -`npm run build: white screen issue on prod` page https://github.com/PanJiaChen/vue-element-admin/issues/3271\r\n\r\nThe upgrade of `vue-cli` is also very simple, basically you don’t need to operate your own instructions, you can refer to https://cli.vuejs.org/migrating-from-v3/\r\n\r\n1. Install the latest version `@vue/cli`\r\n\r\n```bash\r\nnpm install -g @vue/cli\r\n# OR\r\nyarn global add @vue/cli\r\n```\r\n\r\n2. Then execute\r\n\r\n```bash\r\nvue upgrade\r\n```\r\n\r\nThe script will automatically upgrade for you\r\n\r\n## :warning: Breaking Changes\r\n\r\n**One thing needs extra attention. In the new version, the control of lazy loading via `VUE_CLI_BABEL_TRANSPILE_MODULES` is abandoned.**\r\n\r\n### Elimination reason\r\n\r\nIn the era of `vue-cli@3`, using `VUE_CLI_BABEL_TRANSPILE_MODULES` is ok, but it is actually fragile, as in `vue-cli@4`, vue-cli introduces `babel-plugin-dynamic-import-node The logic of`has changed, it needs to be `VUE_CLI_BABEL_TRANSPILE_MODULES` and `VUE_CLI_BABEL_TARGET_NODE` to be true at the same time, so as long as the judgment logic of vue-cli changes, we need to make corresponding changes, or be very passive and coupled . So in the `vue-cli@4` version, we no longer set it by `VUE_CLI_BABEL_TRANSPILE_MODULES: true`, but by manually introducing `'babel-plugin-dynamic-import-node'`, see the next section for details.\r\n\r\n### vue-cli@4\r\n\r\n1. No need to configure `VUE_CLI_BABEL_TRANSPILE_MODULES = true` in the `.env.development` file, just delete it.\r\n\r\n2. Run `npm install babel-plugin-dynamic-import-node -S -D`\r\n\r\n3. The way to add the dynamic-import-node plugin in `babel.config.js`, see the next section for details.\r\n\r\n```js\r\nmodule.exports = {\r\n  presets: ['@vue/cli-plugin-babel/preset'],\r\n  env: {\r\n    development: {\r\n      plugins: ['dynamic-import-node']\r\n    }\r\n  }\r\n}\r\n```\r\n\r\nDetail commit：https://github.com/PanJiaChen/vue-element-admin/pull/3028/commits/2ea998f91d889480821468de86df9bf8defbb5f0"},"readme":true,"readme_zh":true,"news":[{"title":"vue-element-admin从下载到运行，完整过程","url":"https://blog.csdn.net/qq_36509946/article/details/124170369","source":"blog.csdn","lang":"zh","date":"2023-07-20"},{"title":"盘点Github上15个火热的Vue3开源项目","url":"https://www.51cto.com/article/742533.html","source":"51CTO","lang":"zh","date":"2022-12-16"},{"title":"vue-element-admin中文版下载","url":"https://blog.csdn.net/weixin_43536855/article/details/117617939","source":"blog.csdn","lang":"zh","date":"2021-06-05"},{"title":"开源GitHub中文浏览器：一键翻译README，解决英文文档阅读痛点","url":"https://news.google.com/rss/articles/CBMiX0FVX3lxTE1uMXl2UnIzRk1FVjloWmw0a01YOGRCMzNfQ1FLUHRfdVpGRXM3eFZEWlcwc3ZGN0N2VmdLQWlyY2JvdHpGSmNhRTlYdUZLSjdTZE9XTmFVaU1hN1lRT2Jv?oc=5","source":"CSDN","lang":"zh","date":"2026-11-08"},{"title":"GitLab catches MongoDB Go module supply chain attack","url":"https://news.google.com/rss/articles/CBMiiwFBVV95cUxPdHdXanQ1anhwemRldi1WalJMemhhOTZyMHNKeHlqamI3bUhhQ1gtX3JMZk9uTUNlWlU2MVNIV2hGaU96OG9nWGpoWGpsUnF5VXlhTWZDMmxlOFc1ZWV1MGlQVWdIWktydTJUcVFLdDRoVFk5bXhhRmxzX21hT0tfTFVUSnNrcG5XWnYw?oc=5","source":"GitLab","lang":"en","date":"2025-06-30"},{"title":"2024年值得推荐的六款 Vue 后台管理系统模板，开源且免费！","url":"https://news.google.com/rss/articles/CBMiU0FVX3lxTE10TEI1ZzdiSmY4NERUMnRtekpiNmZtenZkWDNsSlU2Zzh1Qk9rZURPaHVucERmcGJwQi1XX2VvLW1rZlNGekpjQmVBSllsQ3lYaTZV?oc=5","source":"51CTO","lang":"zh","date":"2024-12-04"},{"title":"14个Vue3开源后台管理项目，优选、多星！","url":"https://news.google.com/rss/articles/CBMiU0FVX3lxTFBzMEZ6R3NaNkIyQ1h1LUVLWVY4WjJUZGlNa3F2NXZEcHl6aGVTNU9GNEVJSHh6UmJ2Y0diUkJwQ2xabkxxSk1vVDZBOTVlaWNCTjRR?oc=5","source":"51CTO","lang":"zh","date":"2023-11-15"},{"title":"Github标星超200K，这10个流行的可视化面板你知道几个","url":"https://news.google.com/rss/articles/CBMiU0FVX3lxTFB6Zm15eERvS1Q5eFFUdW9IdWkyZ1lJWERqTTVUQVM5dUQ0WGwyVzRyM2FiaGJYNkRnY3JJNmNVME0zVUw5OURldlh6aWp6YXAxZkY0?oc=5","source":"51CTO","lang":"zh","date":"2020-08-28"}],"stale":false,"snapshot_at":"2026-11-10T09:35:25Z","history_start":"2026-09-06"}