vue-element-admin
vue-element-admin copied to clipboard
[npm run dev执行报错] Error: Cannot call .tap() on a plugin that has not yet been defined. Call plugin('preload-index').use(<Plugin>) first
npm run dev my package.json "dependencies": { "axios": "0.18.1", "core-js": "3.6.5", "echarts": "^4.9.0", "element-ui": "2.13.2", "html2canvas": "^1.0.0-rc.7", "jquery": "^3.6.0", "less": "^3.12.2", "less-loader": "^7.0.2", "js-cookie": "2.2.0", "normalize.css": "7.0.0", "nprogress": "0.2.0", "path-to-regexp": "2.4.0", "vue": "2.6.10", "vue-router": "3.0.6", "vuex": "3.1.0", "vue-simple-uploader": "^0.7.6", "postcss-loader": "4.2.0", "postcss-pxtorem": "5.1.1" }, "devDependencies": { "@vue/cli-plugin-babel": "4.4.4", "@vue/cli-plugin-eslint": "4.4.4", "@vue/cli-plugin-unit-jest": "4.4.4", "@vue/cli-service": "4.4.4", "@vue/test-utils": "1.0.0-beta.29", "autoprefixer": "9.5.1", "babel-eslint": "10.1.0", "babel-jest": "23.6.0", "babel-plugin-dynamic-import-node": "2.3.3", "chalk": "2.4.2", "connect": "3.6.6", "eslint": "6.7.2", "eslint-plugin-vue": "^6.2.2", "html-webpack-plugin": "3.2.0", "mockjs": "1.0.1-beta3", "postcss-pxtorem": "^5.1.1", "runjs": "4.3.2", "sass": "1.26.8", "sass-loader": "8.0.2", "script-ext-html-webpack-plugin": "2.1.3", "serve-static": "1.13.2", "svg-sprite-loader": "4.1.3", "svgo": "1.2.2", "vue-template-compiler": "2.6.10"
请试着使用 vue inspect --plugins
命令,排查plugin preload-index
是否有被注册。
我是使用 vue-element-template
这一模板的,在使用npm audix fix --force
后由于升级相关包版本造成了preload这一模块的丢失造成的该问题。
可参考https://github.com/vuejs/vue-cli/issues/1729
请试着使用
vue inspect --plugins
命令,排查pluginpreload-index
是否有被注册。 我是使用vue-element-template
这一模板的,在使用npm audix fix --force
后由于升级相关包版本造成了preload这一模块的丢失造成的该问题。 可参考vuejs/vue-cli#1729
笑了,现在迁移到vue3又出现了这个错误,搜索的时候搜到了当初的回答。
当时说的不够详细,总而言之,当时是因为我在下载模板之后使用了npm audix fix --force
这条命令造成的问题,一般来讲下载这个模板的release版本后正常启动都不会有问题。我个人怀疑是因为依赖冲突的问题。不过很可惜我至今都没有精力去琢磨webpack-chain,所以无法给出一个肯切的解释。
请试着使用
vue inspect --plugins
命令,排查pluginpreload-index
是否有被注册。 我是使用vue-element-template
这一模板的,在使用npm audix fix --force
后由于升级相关包版本造成了preload这一模块的丢失造成的该问题。 可参考vuejs/vue-cli#1729笑了,现在迁移到vue3又出现了这个错误,搜索的时候搜到了当初的回答。 当时说的不够详细,总而言之,当时是因为我在下载模板之后使用了
npm audix fix --force
这条命令造成的问题,一般来讲下载这个模板的release版本后正常启动都不会有问题。我个人怀疑是因为依赖冲突的问题。不过很可惜我至今都没有精力去琢磨webpack-chain,所以无法给出一个肯切的解释。
今天想给项目升级至vue2.7 然后run dev的时候爆了这个错误....问题是 我输入 vue inspect --plugins
还是会报一样的错误
Error: Cannot call .tap() on a plugin that has not yet been defined. Call plugin('preload').use(<Plugin>) first.
所以你后来放弃了么
'I've received your email and will will reply to you as soon as possible after the vacation.————————————This is an auto reply email from QQ Mail.'
请试着使用
vue inspect --plugins
命令,排查pluginpreload-index
是否有被注册。 我是使用vue-element-template
这一模板的,在使用npm audix fix --force
后由于升级相关包版本造成了preload这一模块的丢失造成的该问题。 可参考vuejs/vue-cli#1729笑了,现在迁移到vue3又出现了这个错误,搜索的时候搜到了当初的回答。 当时说的不够详细,总而言之,当时是因为我在下载模板之后使用了
npm audix fix --force
这条命令造成的问题,一般来讲下载这个模板的release版本后正常启动都不会有问题。我个人怀疑是因为依赖冲突的问题。不过很可惜我至今都没有精力去琢磨webpack-chain,所以无法给出一个肯切的解释。今天想给项目升级至vue2.7 然后run dev的时候爆了这个错误....问题是 我输入
vue inspect --plugins
还是会报一样的错误Error: Cannot call .tap() on a plugin that has not yet been defined. Call plugin('preload').use(<Plugin>) first.
所以你后来放弃了么
是的。我后面回退版本了。
经过几天的调试,以下是我的更新vue2.7的依赖包,没有大的Error。
eslint.js
由于跨大版本,部分格式不兼容,目前发现的给贴出来了。
elementUI
这块考虑到目前没有发现致命的bug或者功能无法实现,同时也害怕更新2.15后有不兼容问题,所以暂时不考虑更新。编译的时候个别element组件有语法报错的,稍微修改下就行。
axios
我也更新了,如果你还在用框架的mock进行用户login和getinfo等操作的话会有bug,需要自己调整。 vue.config
插件部分也有问题,webpack我也不懂(还是vite香),百度解决。
个人认为如果你只是喜欢组合式api升级到2.7就好了,如果刚需vue3的可以考虑换框架了,这个库已经没人维护了,强行升级,你成本高,团队成本也高。
更改版本后需要删除本地依赖缓存和package-lock.json
。
package.json
"dependencies": {
"axios": "1.4.0",
"clipboard": "2.0.4",
"codemirror": "5.58.2",
"core-js": "3.6.5",
"driver.js": "0.9.5",
"dropzone": "5.5.1",
"echarts": "5.4.3",
"element-ui": "2.13.0",
"file-saver": "2.0.1",
"flv.js": "^1.6.2",
"fuse.js": "3.4.4",
"js-cookie": "2.2.0",
"jsonlint": "1.6.3",
"jszip": "3.8.0",
"mapvgl": "^1.0.0-beta.172",
"mqtt": "^4.3.7",
"normalize.css": "7.0.0",
"nprogress": "0.2.0",
"path-to-regexp": "2.4.0",
"screenfull": "4.2.0",
"sortablejs": "1.8.4",
"three": "^0.148.0",
"vue": "2.7.8",
"vue-baidu-map": "^0.21.22",
"vue-count-to": "1.0.13",
"vue-router": "3.0.2",
"vue-splitpane": "1.0.4",
"vuedraggable": "2.20.0",
"vuex": "3.1.0",
"xlsx": "0.16.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^4.5.18",
"@vue/cli-plugin-eslint": "^5.0.8",
"@vue/cli-plugin-unit-jest": "^4.5.18",
"@vue/cli-service": "^4.5.18",
"@vue/test-utils": "1.0.0-beta.29",
"autoprefixer": "9.5.1",
"babel-eslint": "10.1.0",
"babel-jest": "23.6.0",
"babel-plugin-dynamic-import-node": "2.3.3",
"chalk": "2.4.2",
"chokidar": "2.1.5",
"connect": "3.6.6",
"eslint": "^7.5.0",
"eslint-plugin-vue": "^8.7.1",
"html-webpack-plugin": "3.2.0",
"husky": "1.3.1",
"lint-staged": "8.1.5",
"mockjs": "1.0.1-beta3",
"plop": "2.3.0",
"runjs": "4.3.2",
"sass": "1.26.2",
"sass-loader": "8.0.2",
"script-ext-html-webpack-plugin": "2.1.3",
"script-loader": "^0.7.2",
"serve-static": "1.13.2",
"svg-sprite-loader": "4.1.3",
"svgo": "1.2.0",
"webpack": "^4.46.0"
},
eslint.js
env: {
browser: true,
node: true,
es6: true,
'vue/setup-compiler-macros': true
},
extends: ['plugin:vue/recommended', 'eslint:recommended'],
// add your custom rules here
//it is base on https://github.com/vuejs/eslint-config-vue
rules: {
'vue/first-attribute-linebreak': [2, {
// 单行时,第一属性前不允许使用换行符
singleline: 'beside',
// 多行时,第一属性前必须使用换行符
multiline: 'below',
}],
"vue/max-attributes-per-line": [2, {
"singleline": 10,
"multiline": {
"max": 1,
// "allowFirstLine": false
}
}],
vue.config
chainWebpack(config) {
// it can improve the speed of the first screen, it is recommended to turn on preload
// it can improve the speed of the first screen, it is recommended to turn on preload
config.plugin('preload').tap(() => [
{
rel: 'preload',
// to ignore runtime.js
// https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
include: 'initial'
}
])
前端的互相依赖真是个老大难的问题,各种项目每次install都会跳一大堆warning之类的,不知道什么时候会解决。