ExtJS与VS Code的环境搭建

ExtJS与VS Code的环境搭建

VS Code中有对ExtJS的代码提示的插件支持，不过那个插件是要激活的，仅仅学习的情况下该怎么白嫖呢，下面就来介绍一下。

首先我们需要下载ExtJS的库，再往后的就需要购买了，下载地址。
需要先填写表格，才能下载，后缀是gpl的版本是免费的，没有gpl后缀的其他版本是有30天的试用期。另外这个网站特别卡，建议自行找资源下载。

其次如果想要简单又快速的生成mvvm结构项目可以选择下载SenchaCmd，来自动生成项目，下载地址。

这里如果你没有它需要的java的运行环境就选第一个DOWNLOAD WITH JRE INCLUDED（下载包括jre）
如果你有它需要的java的运行环境就选第二个DOWNLOAD WITHOUT JRE INCLUDED（下载不包括jre）

这里建议统一选第一个，因为他的jre是有需求版本的，你就算有java也不一定跟他的版本对应，而且jre也就多个20M。

最后在VS Code中下载代码提示插件Sencha Ext JS，当然到了这一步还需要激活使用，我们这里可以通过改源码的方式跳过激活，首先在文件资源管理器中打开该目录：C:\Users\用户名\.vscode\extensions\sencha.vscode-extjs-版本号\out\src，在里面找到LicenseManager.js打开。
找到下面这段代码⬇

return this.manager.verify().then(() => {
	const licenses = this.manager.getProductLicenses()
        .filter(license => license.signature)
        .map(license => this.createLicenseObject(license));
    this.license = licenses.find(l => l.active && l.full) || // try to find an active paid license 
        licenses.find(l => l.active) || // try to find an active trial license
        licenses[0]; // default to the first license
    if (!this.license || !this.license.active || !this.license.full) {
        statusBarActivation.show();
    }
    licenseJson = this.license && this.license.data;
});

将其改为以下代码⬇

return this.manager.verify().then(() => {
   /* const licenses = this.manager.getProductLicenses()
        .filter(license => license.signature)
        .map(license => this.createLicenseObject(license));
    this.license = licenses.find(l => l.active && l.full) || // try to find an active paid license 
        licenses.find(l => l.active) || // try to find an active trial license
        licenses[0]; // default to the first license
    if (!this.license || !this.license.active || !this.license.full) {
        statusBarActivation.show();
    }*/
    this.license={
        active:true,
        full:true,
        data:{}
    };
    licenseJson = this.license && this.license.data;
});

好了现在激活提示就消失了，可以在项目中跳转ExtJS方法以及对ExtJS的代码提示，同时在VS Code的资源管理器中右键可以选择New Ext JS App来利用ExtJS SDK与Sencha Cmd生成项目。

但是以上功能中的代码提示与方法跳转都只能在Cmd生成的项目中使用，如果是自己搭项目，通过引用ext-all.js和css的方式来使用ExtJS的话插件是不起作用的，需要在项目中生成 .sencha文件夹才能使用，生成方式如下⬇
使用快捷键Ctrl+Shift+p打开命令面板，输入 >Enable Ext JS IntelliSense for this Project就能生成.sencha文件夹，继续快乐的使用ExtJS插件了。