vue-cli兼容es2020可选链操作符 ?.和空值合并??

最新推荐文章于 2024-07-19 10:53:52 发布

Stavin Li

最新推荐文章于 2024-07-19 10:53:52 发布

阅读量730

点赞数 9

文章标签： vue.js javascript 前端

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/m0_37285193/article/details/135369155

版权

本文介绍了如何在JavaScript项目中通过Babel插件实现optionalchaining和nullishcoalescingoperator的支持，以及在Vue项目中如何配置vue-template-babel-compiler来处理模板编译。

摘要由CSDN通过智能技术生成

一、`script`支持

1.安装插件：

npm i @babel/plugin-proposal-optional-chaining --save
npm i @babel/plugin-proposal-nullish-coalescing-operator --save

2.`babel.config.js`配置

module.exports = {
    ...
    plugins: [
        '@babel/plugin-proposal-optional-chaining',
        '@babel/plugin-proposal-nullish-coalescing-operator',
	...	
    ]
};

二、`template`支持

1.安装插件：

npm i vue-template-babel-compiler --save

2.`vue.config.js`

module.exports = {
    ...
    chainWebpack: (config) => {
        config.module
            .rule('vue')
            .use('vue-loader')
            .tap((options) => {
	        options.compiler = require('vue-template-babel-compiler');
                return options;
            });
        }
    }
}