@vue/cli 5.0.8 项目依赖版本参照

有的同学,可能是在维护迭代老的项目, 脚手架是从 @vue/cli 3.x ,想要升级到 5.x 获得更好的开发体验, 可以参照下面的

@vue/cli 应该是以后不会再更新了, 5.0.8应该是最后一个版本,大家可以迁移到 vite相关的生态,迁徙是一条漫长的道路

依赖包

json 复制代码
  "scripts": {
    "lint-staged": "lint-staged"
 },
 "dependencies": {
    "axios": "^1.5.0",
    "core-js": "^3.30.2",
    "element-ui": "2.15.13",
    "vue": "^2.7.14",
    "vue-router": "^3.6.5",
    "vuex": "^3.6.2"
  },
  "devDependencies": {
    "@babel/core": "^7.21.8",
    "@babel/eslint-parser": "^7.21.8",
    "@commitlint/cli": "^17.6.3",
    "@commitlint/config-conventional": "^17.6.3",
    "@vue/cli-plugin-babel": "^5.0.8",
    "@vue/cli-plugin-eslint": "^5.0.8",
    "@vue/cli-service": "^5.0.8",
    "@vue/eslint-config-prettier": "^7.1.0",
    "chalk": "^4.1.2",
    "eslint": "^8.41.0",
    "eslint-config-airbnb-base": "^15.0.0",
    "eslint-plugin-import": "^2.27.5",
    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-vue": "^9.13.0",
    "husky": "^8.0.3",
    "less": "^4.1.3",
    "less-loader": "^11.1.0",
    "lint-staged": "^13.2.0",
    "prettier": "^2.8.8",
    "sass": "^1.62.1",
    "sass-loader": "^13.2.2",
    "semver": "^7.5.1"
  },

稳定运行在node 14.21.3 版本

公司内部项目也很多 ,部分项目在有时间的条件下,升级到 5.0.8 以后, 稳定运行一年以上,没有出现无法解决的问题

其中, chalk 这个必须锁版本号, 4.1.2 , 因为 5.x的版本是采用 ESM的方式, 在配置一些脚本,会出现加载报错, 还是加载方式的问题。

husky 也是从 4.x 升级到 8.x 版本, 也是稳定运行

babel配置

js 复制代码
module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset',
    [
      '@vue/babel-preset-jsx',
      {
        "injectH": false
      }
    ]
  ]
}

其实很多人在开发或者使用webpack等一众脚手架上,出现的问题,很多是版本号对应不上的导致的, 这个可以很好的参照

vue从 2.5, 2.6 升级到 2.7 , 需要关注一下 deep语法的改变即可

sass 和less 深度选择器

html 复制代码
<style lang="scss" scoped>
<!--语法错误-->

/deep/ .box {}

<!---语法警告 能运行 但是不建议这样写-->
::v-deep .box {}

<!--推荐 正确写法-->
:deep(.el-menu) {

}
</style>
相关推荐
傻球2 分钟前
Jotai 使用详解:React 轻量级状态管理库
前端·react.js
Json_3 分钟前
Vue 构造器 Vue.extend
前端·vue.js·深度学习
伶俜monster4 分钟前
UV 法向量实验室:Threejs 纹理与光照炼金术
前端·webgl·three.js
小old弟4 分钟前
老生常谈: 谈谈对vue的理解?vue3有而vue2没有的东西或者说特性?
前端·vue.js
蔓越莓7 分钟前
[Electron] win.setSize 在RTL布局下的表现,是否需要适配?
前端·electron
Json_12 分钟前
Vue 实例方法
前端·vue.js·深度学习
数据攻城小狮子12 分钟前
Java Spring Boot 与前端结合打造图书管理系统:技术剖析与实现
java·前端·spring boot·后端·maven·intellij-idea
阿鲁冶夫26 分钟前
最佳实践初始化项目公用cli
前端
Json_40 分钟前
实例入门 实例属性
前端·深度学习
Json_40 分钟前
JS中的apply和arguments小练习
前端·javascript·深度学习