热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Windows系统下安装和部署Egret的开发环境

Egret基于TypeScript开发的,而TypeScript编译工具tsc是基于Node.js开发的。所以在安装过程中,我们先需要对于基础支持工具进行安装。

需要安装的软件如下:

Node.js
TypeScript
TypeScript代码编辑器
HTTP服务器(可选)
Chrome(可选)
Egret
这篇文档中,我们主要介绍在Windows环境中安装Egret。其安装步骤如下。

1.安装Node.js

1.1下载Node.js

Node.js的安装方法非常简单,我们可以访问 Node.js官网,然后进点击页面中的INSTALL按钮,可直接下载Node.js的msi安装文件包。

Nodejs

本教程撰写时,Node.js版本为0.10.29,如果你的版本高于此版本,我们会提供相关的版本兼容说明。如未提供任何版本兼容说明,则表示你的版本适用于Egret。
双击msi安装包,我们开始安装Node.js。安装过程如图:

Nodejs install

下载后的Node.js安装包

1.2安装Node.js

Nodejs install

开始安装界面

Nodejs install

许可证授权说明

Nodejs install

选择安装目录,我们保持默认选项

Nodejs install

选择安装内容,我们将所有工具包全部安装

Nodejs install

确认安装,点击“Install”按钮

Nodejs install

安装过程

Nodejs install

安装完成界面,你的Node.js被安装到 C:\Program Files\nodejs\目录下,同时该安装包还会为你安装npm工具。

1.3验证Node.js

安装完成后,请启动你的命令行工具,输入node -v命令,来查看你当前的Node.js版本,同时验证你的Nodejs是否安装成功。如果安装正确,则应出现效果如下图。

Nodejs install

在开始——>搜索中输入cmd即可运行命令行工具。

Nodejs install

Nodejs install

如果出现node 不是内部或外部命令,也不是可运行的程序或批处理文件则表示安装失败,可以参考下面的Node.js安装失败解决方案或者在我们的开发者社区中求助。

1.4验证npm

在命令行工具中执行npm,出现如下图内容,标明你的npm安装正确。

Nodejs install

如果出现npm 不是内部或外部命令,也不是可运行的程序或批处理文件则表示安装失败,可以参考下面的Node.js安装失败解决方案或者在我们的开发者社区中求助。

1.5Node.js安装失败解决方案

部分Windows安装完成后直接在cmd里输入node和npm,可能会提示找不到该命令。是由于新增的Path路径需要重启才能生效。重启或使用node和npm的绝对路径来运行命令即可。

2.安装TypeScript

2.1安装TypeScript

当 node.js安装成功后,node 和 npm 命令就可以使用了。TypeScript的安装可视直接使用npm命令直接安装。详细的安装方法可以参考TypeScript官网。

在终端中输入如下命令:npm install -g typescript

npm install命令的作用是在开发者的系统中安装指定的Node.js库,typescript是库的名称,-g代表将这个库安装到全局路径

Nodejs install
如果由于网络问题导致的安装速度很慢,请使用 npm install -g typescript --registry=http://r.cnpmjs.org 命令,访问国内镜像版进行安装。

2.2验证TypeScript

安装成功后,执行 tsc 命令,您应该看见如下界面

Nodejs install

3.安装TypeScript代码编辑器

3.1选择一个合适的代码编辑器

Egret可以使用任何支持脚本语言的代码编辑器,包括:

WebStorm 官方下载地址【官方推荐】
Microsoft Visual Studio 2012 + TypeScript插件
Sublime Text + TypeScript插件
详细的编辑器安装方法以及插件配置方法,可参考文档中工具相关章节。

4.安装一个HTTP服务器

4.1选择一个合适的HTTP服务器

Windows用户推荐采用XMAPP

用户也可以跳过这个步骤,使用Egret内置的基于Node.js的简单HTTP服务器。但为了保证更好的开发体验,Egret建议用户安装上述较为成熟的HTTP服务器

具体服务器软件安装,大家可以参考文档中工具相关章节。

5.安装Chrome浏览器

Egret可以运行在绝大多数的现代浏览器上,但是 Egret 目前推荐开发者使用 Chrome 作为主要的开发和调试环境。

打开Chrome浏览器
设置->工具->Javascript控制台
在Javascript控制台(右下角)设置(齿轮图标)-> 常用 -> 禁用浏览器缓存
当进行好上述设置之后,只要Javascript控制台处于打开状态,就不会有浏览器缓存,方便调试。

6.下载并安装 Egret

6.1从官网中下载Egret

Egret提供两个下载渠道,一个是Egret官方下载,另外一个是Egret Github下载。

我们推荐大家从官方网站中下载,这里的版本是当前稳定版本。如果你从github中下载引擎的开发版本,该版本非稳定版,你可能在实际开发中遇到许多问题,这些问题通常不会在稳定版中出现。

我们打开官方下载页面,找到“Egret引擎”产品项目,点击蓝色的下载按钮,下载最新版Egret引擎,如图。

Nodejs install

6.2安装Egret

将下载后的Egret引擎压缩包解压到指定目录,该目录可以为任意磁盘中目录,如图:

Nodejs install

Nodejs install

在命令行工具中敲入命令进入解压后的目录。由于我们将解压后的文件放置于F:盘,因此我们先进入F盘,命令如下:

f:

Nodejs install

随后我们进入对应的目录中,如图

Nodejs install

进入该目录后,我们执行安装命令。

npm install -g

Nodejs install

如果安装命令错误,请检查如下三项,查看是否正确。
命令中的当前的路径是否正确。
当前目录是否是Egret目录(该目录下存在一个名为 package.json 的文件)
系统当前用户是否有管理员权限,如果将Egret解压到C盘,可能会出现此问题。

6.3Egret工具验证

安装完成后,我们执行egret命令,来查看当前Egret是否安装成功。如安装成功,应出现如下图所示。

Nodejs install

如果安装失败,请在我们的开发者社区中寻求帮助。


推荐阅读
  • 【node.js】关于node.js,如何解决npm should be run outside of the Node.js REPL, in your normal shell报错?
    问题描述前言,安装node方式采用的是安装包解压的报如下错误:npmshouldberunoutsideoftheNode.jsREPL,inyournormals ... [详细]
  • Node.js学习笔记(一)package.json及cnpm
    本文介绍了Node.js中包的概念,以及如何使用包来统一管理具有相互依赖关系的模块。同时还介绍了NPM(Node Package Manager)的基本介绍和使用方法,以及如何通过NPM下载第三方模块。 ... [详细]
  • 本文介绍了JavaScript进化到TypeScript的历史和背景,解释了TypeScript相对于JavaScript的优势和特点。作者分享了自己对TypeScript的观察和认识,并提到了在项目开发中使用TypeScript的好处。最后,作者表示对TypeScript进行尝试和探索的态度。 ... [详细]
  • RN即ReactNative基于React框架针对移动端的跨平台框架,在学习RN前建议最好熟悉下html,css,js,当然如果比较急,那就直接上手吧,毕竟用学习前面基础的时间,R ... [详细]
  • 前言:原本纠结于Web 模板,选了Handlebars。后来发现页面都是弱逻辑的,不支持复杂逻辑表达式。几乎要放弃之际,想起了Javascript中eval函数。虽然eval函 ... [详细]
  • Node.js详细安装及环境配置
    1、下载安装根据自己电脑系统及位数选择,我这里选择windows64位.msi格式安装包(官网:https:odejs.orgzh-cndownload).msi和.zip格式区别 ... [详细]
  • Vue3 拥抱 TypeScript 的完整项目结构搭建
    大厂技术高级前端Node进阶点击上方程序员成长指北,关注公众号回复1,加入高级Node交流群一个完整的Vue3Ts项目,支持.vue和.tsx写法项目地 ... [详细]
  • Angular10.0.0-next.6已发布,具体更新内容如下:BugFixesbazel:ng_package规则应更新ts_library目标的“package.json”(#36944)(d5293d2)compiler:删除未解决的DI参数的过时和无效警告(#3 ... [详细]
  • 写在文章前这篇文章翻译自ASYNCAWAITWILLMAKEYOURCODESIMPLER,这是一篇写于2017年八月的文章,并由某专栏提名为17年十大必读文章。翻译的不好的处所, ... [详细]
  • 用typescript来写npm模块还不知道typescript是啥的前端童鞋需要做下功课了。随着es6的普及,越来越多的npm模块都开始用es6编写或者重构,看上去或者听起来都挺 ... [详细]
  • Python瓦片图下载、合并、绘图、标记的代码示例
    本文提供了Python瓦片图下载、合并、绘图、标记的代码示例,包括下载代码、多线程下载、图像处理等功能。通过参考geoserver,使用PIL、cv2、numpy、gdal、osr等库实现了瓦片图的下载、合并、绘图和标记功能。代码示例详细介绍了各个功能的实现方法,供读者参考使用。 ... [详细]
  • 深入理解CSS中的margin属性及其应用场景
    本文主要介绍了CSS中的margin属性及其应用场景,包括垂直外边距合并、padding的使用时机、行内替换元素与费替换元素的区别、margin的基线、盒子的物理大小、显示大小、逻辑大小等知识点。通过深入理解这些概念,读者可以更好地掌握margin的用法和原理。同时,文中提供了一些相关的文档和规范供读者参考。 ... [详细]
  • 本文介绍了Windows操作系统的版本及其特点,包括Windows 7系统的6个版本:Starter、Home Basic、Home Premium、Professional、Enterprise、Ultimate。Windows操作系统是微软公司研发的一套操作系统,具有人机操作性优异、支持的应用软件较多、对硬件支持良好等优点。Windows 7 Starter是功能最少的版本,缺乏Aero特效功能,没有64位支持,最初设计不能同时运行三个以上应用程序。 ... [详细]
  • 使用chrome编辑器实现网页截图功能的方法
    本文介绍了在chrome浏览器中使用编辑器实现网页截图功能的方法。通过在地址栏中输入特定命令,打开控制台并调用命令面板,用户可以方便地进行网页截图操作。 ... [详细]
  • React 分别打包测试、生产环境的配置
    在实际项目开发中,前端会面对多个环境的接口:开发环境、测试环境、生产环境,所以项目中网络请求的baseUrl也需要跟随这些环境来变化。我 ... [详细]
author-avatar
漂亮的乖猫9898
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有