首页 > 其他分享 >初试Ext JS 6.6的NPM版(一)

初试Ext JS 6.6的NPM版(一)

时间:2023-03-03 10:31:39浏览次数:48  
标签:NPM -- theme JS 6.6 Ext template gen


从Ext JS 6.6开始,Ext JS也支持使用nmp来进行辅助开发了。为什么要选择nmp来辅助开发呢?之前使用Sencha Cmd也挺好的。Cmd确实也不错,但唯一的缺点就是不能确定最新版的Cmd是否适合适合你现在项目的版本,笔者一直在用Ext JS 6.2的GPL版本,也一直没去升级Cmd的版本,就是为了避免出问题。使用nmp可以减少这样的麻烦,而且使用npm来进行辅助开发是目前的发展潮流,为了跟上潮流,也应该尝试一下,说不定会喜欢上这种开发模式。

在使用前先根据​​《Getting Started with Ext JS Open Tooling》​​里的说明安装好​​ext-get​​​。安装好​​ext-gen​​​以后,在命令提示符窗口输入​​ext-gen --help​​来查看一下创建应用程序的方式,命令执行后会显示如下输出:

Sencha ExtGen v0.0.194 - The Ext JS code generator

Quick Start: ext-gen -a

ext-gen app (-h) (-d) (-i) (-t 'template') (-m 'moderntheme') (-c 'classictheme') (-n 'name') (-f 'folder')

-h --help show help (no parameters also shows help)
-d --defaults show defaults for package.json
-i --interactive run in interactive mode (question prompts will display)
-t --template name for Ext JS template used for generate
-c --classictheme theme name for Ext JS classic toolkit
-m --moderntheme theme name for Ext JS modern toolkit
-n --name name for Ext JS generated app
-f --folder folder name for Ext JS application (not implemented yet)
-v --verbose verbose npm messages (for problems only)

Examples:
ext-gen app --template universalclassicmodern --classictheme theme-graphite --moderntheme theme-material --name CoolUniversalApp
ext-gen app--template classicdesktop --classictheme theme-graphite --name CoolDesktopApp
ext-gen app --interactive
ext-gen app -a --classictheme theme-graphite -n ClassicApp
ext-gen app -a -t moderndesktop -n ModernApp

Templates:
You can select from 4 Ext JS templates provided by Sencha ExtGen

classicdesktop (default)
This template is the default template in ext-gen. It contains 1 profile, configured to use the classic toolkit of Ext JS for a desktop application

moderndesktop
This template is similar to the classicdesktop template. It contains 1 profile, configured to use the modern toolkit of Ext JS for a desktop application

universalclassicmodern
This template contains 2 profiles, 1 for desktop (using the classic toolkit), and 1 for mobile (using the modern toolkit)

universalmodern
This template contains 2 profiles, 1 for desktop and 1 for mobile. Both profiles use the modern toolkit.

Theme Names:
classic themes: theme-classic, theme-neptune, theme-neptune-touch, theme-crisp, theme-crisp-touch theme-triton, theme-graphite
modern themes: theme-material, theme-ios, theme-neptune, theme-triton

在帮助信息的​​Examples​​一节,我们可以看到生成通用应用程序、经典桌面应用程序、交互模式、使用石墨主题的经典应用程序和现代桌面应用程序等5个示例代码。

笔者要尝试的是经典桌面应用程序,还是使用海卫一主题,那个石墨主题的色调要自己重新调,还是算了。在命令行中输入以下命令来创建应用程序:

ext-gen app -c theme-triton -n Admin

由于经典模版是默认模版,因而不需要去指定模版,在命令中只需要指定主题和项目名称就可以的了。比较遗憾的是f选项居然还没实现,不能指定文件夹。

等待创建操作完成后,会在命令行窗口看到以下输出:

type "cd admin" then "npm start" or "npm run desktop"
to run the development build and open your new application in a web browser

根据提示先执行命令​​cd admin​​​进入项目文件夹,然后执行​​npm start​​​或​​npm run desktop​​命令在浏览器打开应用程序了,可看到如下图所示的效果。

初试Ext JS 6.6的NPM版(一)_desktop

从图中可以看到,Ext JS 6.6提供了一个新的应用程序模版,看还去还好,不过不是笔者想要的,还是修改回管理模版比较好。

今天先到这了。


标签:NPM,--,theme,JS,6.6,Ext,template,gen
From: https://blog.51cto.com/dqhuang/6098079

相关文章

  • Diffusion-LM Improves Controllable Text Generation
    目录概符号说明流程代码LiX.L.,ThickstunJ.,GulrajaniI.,LiangP.andHashimotoT.B.Diffusion-lmimprovescontrollabletextgeneration.arXivpreprinta......
  • npm ERR! cb() never called!
    npminstall过程中报错npmERR!cb()nevercalled!解决办法:【亲测貌似没用,但有的说有用】>npm cacheclean-f后删除node_modules和package-lock.json,重新执行np......
  • text/event-stream
    content-type为text/event-streamwebpack热更新需要向浏览器推送信息,一般都会想到websocket,但是还有一种方式,叫做Server-SentEvents(简称SSE)。SSE是websocket的一种轻型......
  • 如何上传你的组件到npm
    前言以react为例子webpack作为打包工具准备工作安装nodenpm上注册账号https://www.npmjs.com/创建要上传组件新建项目生成package.json文件npminit安装依赖np......
  • 【npm】npm命令
    root@basic-services:~#npm-lUsage:npm<command>where<command>isoneof:accessnpmaccesspublic[<package>]npmaccessrestr......
  • 【npm】基础
    0、一个项目如果依赖某些npmpackage,那么该项目本身就是一个npmpackage。1、一个npmpackage需要有package.jsonREADME.mdLISCENSE.mdindex.js文件,并且npminit时信息要......
  • 【npm】在Ubuntu1804部署Verdaccio
    1、创建verdaccio系统用户:$sudoadduser--system--gecos'VerdaccioNPMmirror'--group--home/var/lib/verdaccioverdaccio 2、切换到该用户,并且切入该用户的家目......
  • Docker + Verdaccio搭建Npm私有库
    废话不说,直接进入正题。搭建私服需要一台服务器,1核2G即可。一、安装Dockerlinux 服务器使用 curl下载快速安装的shell脚本curl-fsSLget.docker.com-oget-docker.......
  • MySQL出现“BLOB/TEXT column used in key specification without a key length”的解
    问题排查在我用GORM保存对象的的时候,报了“BLOB/TEXTcolumnusedinkeyspecificationwithoutakeylength”的错误。经过网上查资料发现最主要原因是,我把longtext字......
  • npm install时遇到错误"error:0308010C:digital envelope routines::unsupported"的解
    今天早上打开电脑,更新了日常工作的github仓库,然后就是习惯性地执行了"npminstall",发现报了下面这个错误:Error:error:0308010C:digitalenveloperoutines::unsuppo......