Ionic3使用CLI生成新页面时配置默认导入与构造方法

太棒的问题了！在Ionic 3里要实现CLI生成页面时自动添加指定的导入和构造函数，其实核心是修改Ionic CLI的内置生成模板——毕竟CLI生成文件都是基于预设模板来的，改模板就能一劳永逸解决你的需求。下面一步步来操作：

首先得找到CLI存放页面模板的目录，不同操作系统的路径不一样：

• Windows系统：%USERPROFILE%\.ionic\templates\pages
• macOS/Linux系统：~/.ionic/templates/pages

如果找不到这个路径，可以先随便生成一个测试页面（比如ionic generate page tempTest），然后通过CLI的输出或者文件创建记录辅助定位，不过上面的路径是绝大多数情况下的默认位置。

进入pages模板目录后，找到page.ts文件——这就是CLI生成页面时用来生成.ts文件的模板，打开它进行编辑：

2.1 添加默认导入语句 #

在模板的导入区域，插入你需要的共享函数导入：

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
// 自动添加的共享函数导入
import { SharedFunctions } from '../functions/sharedFunctions.ts';

2.2 调整构造函数模板 #

找到模板里的构造函数代码块，修改为包含SharedFunctions依赖注入的版本：

constructor(
    public navCtrl: NavController,
    public navParams: NavParams,
    // 自动注入的共享函数实例
    public sharedFunctions: SharedFunctions
) {
}

现在运行ionic generate page newDemoPage，去查看生成的newDemoPage.ts文件，你会发现它已经自动包含了你设置的导入语句和带有SharedFunctions注入的构造函数啦！

• 如果你的SharedFunctions在不同页面的导入路径可能变化（比如页面层级不同），可以考虑把它注册为Angular的全局服务，这样就不用纠结路径问题；但如果你的需求就是固定路径导入，上面的方法完全够用。
• 修改模板前建议备份原文件，万一后续需要恢复默认模板，直接替换回去就行。

内容的提问来源于stack exchange，提问作者Jerry