vue项目使用可选链操作符编译报错问题

简介: vue项目使用可选链操作符编译报错问题

可选链操作符是ES2020中推出的新语法,允许我们不需要校验当前属性的类型去尝试访问子属性。

 const a = b?.c?.d


在vue项目中使用可选链操作符语法时会出现编译报错的情况,需要安装babel依赖@babel/plugin-proposal-optional-chaining,并添加到babel.config.js中。


安装

npm install @babel/plugin-proposal-optional-chaining --save-dev

安装过程中可能会出现"源文本中出现无法识别的标记"报错,是由于node版本的问题导致需要使用引号将插件名称包裹。

npm install '@babel/plugin-proposal-optional-chaining' --save-dev

配置


在babel.config.js中添加:

module.exports = {
  presets: ['@vue/app'],
  plugins: ["@babel/plugin-proposal-optional-chaining"]
}
相关文章
|
1天前
|
JavaScript 前端开发
vue动态添加style样式
vue动态添加style样式
|
1天前
|
JavaScript 前端开发
Vue项目使用px2rem
Vue项目使用px2rem
|
1天前
|
JavaScript
vue中watch的用法
vue中watch的用法
|
5天前
|
JavaScript
Vue组件传值异步问题--子组件拿到数据较慢
Vue组件传值异步问题--子组件拿到数据较慢
10 0
|
JavaScript Java 物联网
现有vue项目seo优化
现有vue项目seo优化
|
JavaScript 前端开发
重读vue电商网站45之项目优化上线
重读vue电商网站45之项目优化上线
119 0
重读vue电商网站45之项目优化上线
|
9天前
|
JavaScript
vue学习(3)模板语法
vue学习(3)模板语法
42 11
|
9天前
|
存储 JavaScript 前端开发
vue学习(2)
vue学习(2)
199 65
|
8天前
|
JavaScript
vue学习(4)数据绑定
vue学习(4)数据绑定
29 10
|
8天前
|
JavaScript 前端开发
vue学习(6)
vue学习(6)
26 9