@babel/plugin-proposal-class-properties的使用

@babel/plugin-proposal-class-properties

安装

npm install -D @babel/plugin-proposal-class-properties

作用

插件会将类中的属性编译

参数

loose

boolean, 默认是false
当为false的时候, 属性会通过Object.defineProperty的方式为对象赋值, 为true的时候, 直接通过点语法赋值

功能

源码

class A{
	foo!: string
	bar: string = "bar";
	static rogen = "rogen";
}

参数 loose = true 编译后得效果

class A{
	construtor(){
		this.foo = void 0 
		this.bar = 'bar'
	}
}
A.rogen = 'rogen'

参数 loose = false 编译后得效果

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

class A{
	construtor(){
	    _defineProperty(this, "bar", "rogen");
    	_defineProperty(this, "foo", void 0);
	}
}
_defineProperty(A, "rogen", "rogen");