Vue 2项目Compiling RuleSet编译失败问题求助
问题场景
原本运行正常的Vue 2项目,新增依赖后执行npm run serve时触发构建错误:
Compiling RuleSet failed: Evaluation of condition function threw error (at clonedRuleSet-40.exclude[0]: filepath => {
// always transpile js in vue files
if (/.vue.jsx?$/.test(filepath)) {
return false
}
// exclude dynamic entries from cli-service
if (filepath.startsWith(cliServicePath)) {
return true
}
// check if this is something the user explicitly wants to transpile
if (options.transpileDependencies.some(dep => filepath.match(dep))) {
return false
}
// Don't transpile node_modules
return /node_modules/.test(filepath)
})
项目package.json内容:
{"name": "vue2_project","version": "0.1.0","private": true,"scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build","lint": "vue-cli-service lint"},"dependencies": {"@coreui/coreui": "^2.1.16","@coreui/coreui-plugin-chartjs-custom-tooltips": "^1.3.1","@coreui/icons": "^0.3.0","@coreui/vue": "^3.2.12","@fortawesome/fontawesome-free": "^5.15.4","@types/js-cookie": "^2.2.7","axios": "^0.21.4","bootstrap": "^4.6.2","bootstrap-vue": "^2.2.0","bulma": "^0.9.4","chart.js": "^2.9.4","core-js": "^2.5.7","cropperjs": "^1.5.5","css-vars-ponyfill": "^1.9.0","epic-spinners": "^1.0.3","flag-icon-css": "^3.0.0","jquery": "^1.9.1","js-cookie": "^2.2.0","moment": "^2.22.2","moment-timezone": "^0.5.23","perfect-scrollbar": "^1.4.0","qrcode.vue": "^1.7.0","simple-line-icons": "^2.4.1","vue": "^2.6.14","vue-bootstrap-typeahead": "^0.2.6","vue-chartjs": "^3.4.0","vue-chartjs-typescript": "^3.3.3","vue-class-component": "^6.0.0","vue-clipboards": "^1.3.0","vue-gtag": "^1.16.1","vue-moment": "^4.0.0","vue-multiselect": "^2.1.6","vue-notification": "^1.3.13","vue-password-strength-meter": "^1.3.2","vue-perfect-scrollbar": "^0.1.0","vue-property-decorator": "^7.0.0","vue-router": "^3.5.4","vue-tabs-component": "^1.5.0","vue2-editor": "^2.10.2","vuejs-datepicker": "^1.5.4","vuelidate": "^0.7.4","vuex": "^3.0.1","zxcvbn": "^4.4.2"},"devDependencies": {"@babel/core": "^7.12.16","@babel/eslint-parser": "^7.12.16","@types/vue2-editor": "^2.6.1","@vue/cli-plugin-babel": "^3.0.1","@vue/cli-plugin-e2e-nightwatch": "^3.0.1","@vue/cli-plugin-eslint": "~5.0.0","@vue/cli-plugin-typescript": "^3.0.4","@vue/cli-plugin-unit-jest": "^3.0.1","@vue/cli-service": "^5.0.8","@vue/test-utils": "^1.0.0-beta.24","babel-core": "^7.0.0-bridge.0","babel-jest": "^23.4.2","eslint": "^7.32.0","eslint-plugin-vue": "^8.0.3","sass-loader": "^7.1.0","stylus": "^0.54.5","stylus-loader": "^3.0.2","typescript": "^5.0.4","vue-template-compiler": "^2.6.14"},"eslintConfig": {"root": true,"env": {"node": true},"extends": ["plugin:vue/essential","eslint:recommended"],"parserOptions": {"parser": "@babel/eslint-parser"},"rules": {}},"browserslist": ["> 1%","last 2 versions","not dead"]}
解决方案
1. 定位核心冲突
从依赖列表能看到三个关键不兼容点:
@coreui/vue@3.2.12是Vue 3专属版本,与当前Vue 2项目完全不兼容,需降级到@coreui/vue@2.x@vue/cli-service@5.0.8与其他@vue/cli-plugin-*的3.x版本差异过大,构建规则不匹配typescript@5.0.4对Vue 2 + Vue CLI 3/5的组合兼容性差,需降级到TS4.x
2. 执行修复步骤
- 卸载冲突依赖:
npm uninstall @coreui/vue @vue/cli-service typescript - 安装兼容版本:
npm install @coreui/vue@2.1.16 @vue/cli-service@3.12.1 typescript@4.9.5 - 同步所有Vue CLI插件版本(保持与
@vue/cli-service一致):npm install @vue/cli-plugin-babel@3.12.1 @vue/cli-plugin-eslint@3.12.1 @vue/cli-plugin-typescript@3.12.1 @vue/cli-plugin-e2e-nightwatch@3.12.1 @vue/cli-plugin-unit-jest@3.12.1 - 清理旧依赖缓存:
rm -rf node_modules package-lock.json - 重新安装依赖并启动项目:
npm install npm run serve
3. 额外排查
如果仍报错,检查项目根目录的vue.config.js,确保transpileDependencies配置的正则/字符串格式无语法错误。
内容的提问来源于stack exchange,提问作者Kanchana Kariyawasam

