为Ionic3+ (Angular4+)的项目配置nameof语法糖

熟悉C#的人应该知道,C# 6的新特性中包含一个名为nameof的关键字。使用该关键字可以不用实例化对象,即可获取到类成员变量的名字,比如:

使用nameof(ClassA.fieldA)即可得到”fieldA”。虽然看起来很鸡肋,不过在应用了ORM的项目中,感觉还是很有用的。

而微软的另一个干儿子TypeScript则一直都没有类似的语法糖实现。

某老外便自己实现了基于TypeScript的nameof组件:

https://github.com/dsherret/ts-nameof

但想要应用在我自己的Ionic项目中,光有这个是不够的。

折腾了好久,总算勉强配置好了Ionic项目下的nameof的实现,步骤如下:

Step1:

安装ts-nameof

Step2:

安装ts-nameof-loader(因为Ionic是基于WebPack打包的,所以需要这个WebPack的loader):

Step3:

复制项目根目录下的node_modules\@ionic\app-scripts\config\webpack.config.js到一个相对位置。比如在项目根目录下建立config文件夹,然后把webpack.config.js复制进去。

Step4:

修改复制出来的webpack.config.js文件,在Prod和Dev版本的loader中新增ts-nameof-loader,我的webpack.config.js文件内容如下:

Step5:

修改项目package.json文件,覆盖默认webpack config,例如:

Step6:

在项目中使用nameof关键字,并用console.log打印测试。

 

 

Print Friendly, PDF & Email

留下评论

17 − 9 =

*

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据

%d 博主赞过: