• 应用Puerts须要用到的JS/TS/Node.js常识

    • ts和js的关系：Puerts说简略点就是一个在c#运行时执行的js运行环境。ts是js的扩大语法，而且ts并不能间接执行（临时不能），理论执行的其实是由ts生成的js代码。typescript中文官网学习材料
    • Node.js：Node.js是一个电脑命令行环境下执行js的运行环境，在我了解Node.js和js语言的关系相似于.net和c#的关系。为了将ts生成为js，你须要在开发电脑上装置Node.js。Node.js中文网地址。下载长期反对版即可。
    • npm包管理器：npm全名Node Package Manager，装置完Node.js之后电脑中就有npm命令了。npm install命令能够从npm网站上下载并装置罕用的js依赖包。npm run命令能够执行在package.json中配置快捷命令。npm命令官网文档 package.json官网文档

  • 先写一个Hello World

    • Puerts运行原理是在运行时将js文件的内容作为字符串传给JsEnv对象。所以咱们应将ts文件寄存在Unity工程的Assets文件夹以外，以防止Unity为ts生成.meta，而将ts生成的js文件生成在Assets文件夹内，以供Unity运行时加载。
    • 咱们先在Assets文件夹的同级创立一个TsProj文件夹，在命令行中运行cd到这个文件夹，并运行npm init命令，并始终回车到命令运行完结，这会创立一个package.json文件。

    • 接下来装置依赖，运行命令npm install typescript @types/node webpack-cli，这会创立一个node_modules文件夹，外面寄存着typescript，@types/node，webpack-cli这三个依赖包以及他们各自的依赖包，其中typescript依赖包中蕴含一个tsc可执行文件，即是将ts生成js的命令文件。其余依赖包稍后用到再解释。此时关上package.json，会看到外面多了dependencies字段，外面列举了刚刚装置的依赖包和版本信息。

      另外同级还会呈现一个主动生成的package-lock.json文件，这个文件是用于锁定本次装置所有依赖包的具体版本号，必须保留。如果应用git，也必须一起提交。

    • 下一步咱们手动创立一个名为tsconfig.json的文本文件，其中书写如下内容

      {    "compilerOptions": {        "target": "esnext",        "module": "CommonJS",        "sourceMap": true,        "noImplicitAny": true,        "typeRoots": [            "node_modules/@types"        ],        "moduleResolution": "node",        "outDir": "../Assets/Resources"    }}

      这个文件会通知tsc命令如何生成js文件，如outDir指定了生成门路等等。tsconfig.json官网中文文档
      这里咱们把js文件的生成门路选在Assets/Resources文件夹，这是为了在本文例子中不便Unity加载到代码，理论我的项目中咱们为了热更新，更多时候把js代码生成在Assets/StreamingAssets或其余地位期待打包成AssetBundle，这个我将在前面文章中具体阐明。

    • 而后咱们手动编辑一下package.json文件，在scripts字段中退出如下内容

      ..."scripts": {    "dev": "tsc --watch",    "build": "tsc"},...

      这里的dev和build就是定义了两个npm run快捷指令。比方当你命令行中，在TsProj文件夹下运行npm run dev，即等同于运行tsc --watch，即便你的电脑系统全局环境中不存在tsc这个命令，npm也会主动去以后文件夹的node_modules/.bin文件夹上来寻找tsc可执行文件。
      而这个tsc --watch命令的作用即是把以后文件夹下的所有ts文件依照tsconfig.json中指定的规定生成为js文件。--watch的意思是实时监控以后文件夹的文件变动，并立即从新生成变动的文件。这个机制就非常适合写代码的时候开启，边写边生成，实时失效。这也是为什么咱们应用dev这个快捷词来代表这条命令。
      npm build对应的理论命令是tsc，即只生成js而不监听变动。

    • 筹备工作就绪，当初能够开始写ts代码了，创立index.cts文件，书写如下内容：

      console.log("hello world");

      index这个词在ts/js语言习惯中罕用来代表程序的入口

      为什么后缀要用.cts而非.ts？
      因为.ts生成的js文件名是.js，又因为此范例中应用Puerts的默认Loader只能将js文件生成在Unity的Assets/Resources文件夹下，并应用Resources.Load函数加载文本资源，又因为Resources.Load不能辨认后缀为.js的文本资源。所以应用.cts生成进去的js文件名是.cjs，是为了不便Resources.Load函数辨认。同时，在Node.js的命名规范中，.cjs代表应用惯例js语法编写的js代码，.mjs代表应用新的es6语法编写的模块化js代码。所以应用.cts/*.cjs正好符合标准又合乎此处的须要。
      后续文章中我会介绍如何在Puerts中应用自定义loader加载文本资源，那时就能够应用看起来失常一点的.ts和.js了

    • 上面生成js，在命令行中执行npm run dev，此时命令行窗口进入继续监听状态，所以在后续开发过程中不要敞开这个窗口。如果须要运行其余命令就再开一个新窗口。
    • 此时查看Assets/Resources文件夹，该当曾经呈现了index.cjs文件，和index.cjs.map文件，.map文件是用于记录开发环境下js代码与ts代码中符号和行号映射关系的，个别是程序报错的时候才会用到。
    • ts这边的配置和代码生成工作都实现了，下一步开始回到Unity这边。将Puerts插件引入Unity工程的Assets/Plugins文件夹。我这里应用的是github上间接下载的1.4.0 release的v8版。

    • 在Unity中关上一个空场景，在主相机上挂一个Test.cs脚本作为程序入口，在其中书写如下代码

      using System.Collections;using System.Collections.Generic;using UnityEngine;using Puerts;public class Test : MonoBehaviour{    private JsEnv _jsEnv;    void Start()    {        _jsEnv = new JsEnv();        _jsEnv.ExecuteModule("index.cjs");     }}
      • 此时查看Unity控制台输入
    • 下集预报
      Hello world只是验证插件的可行性，想要将Puerts投入到商业我的项目的开发流程或生产环境中还须要定制很多方面的性能，例如实现ts文本资源的打包和热更新、ts与c#的互调传值、生成提醒文件和绑定代码、Inspector面板拖拽赋值等等。下一篇咱们从ts和c#互调开始缓缓道来。