跳到主要内容

NPM和TypeScript支持

提示
  • 本章节说明基于EC 鸿蒙Next USB版本 2.0+

NPM支持​

安装npm​

工程支持npm​

  • 在工程上-鼠标右键-选择·新增NPM支持·
  • 新增完成后，会在当前工程目录下生成一个package.json文件，表示新增完成
  • 剩余的只需要在工程下，执行npm install xxx类库名称即可完成类库的安装，例如 npm install md5，即可安装md5类库，使用方式直接安装md5官方说明

注意事项​

  • 由于npm类库存在不同运行环境包括web，node等，EC的js环境是纯js的，使用npm安装的类库，一定要找纯js环境的
  • 并不是所有的npm类库都支持

TypeScript支持​

安装TypeScript​

工程支持TypeScript​

  • 在工程上-鼠标右键-选择·新增TypeScript支持
  • 新增完成后，会在当前工程目录下生成一个 tsconfig.json 文件，同时会对libs下面的js生成d.ts引用文件

js文件夹下编写ts​

  • js文件夹下编写的js文件都会转换为java的字节码，所以无法使用require，请不要使用export关键字导出，但是可以引用其他文件的js文件
  • 在js文件编写ts文件，例如Card.ts，保存文件的时候会自动生成Car.d.ts和Card.js文件，在其他js文件中直接引用 
    // 文件名称 js/Car.ts
    class Car{
        test():void{
            logd("i am car.")
        }
    }
  • 在其他js文件中调用 
    // 文件名称 js/main.js
    function main(){
        let car = new Car();
        car.test()
    }

ts文件夹下编写ts文件​

  • 注意ts文件夹下需要export导出，在其他地方进行require引用 
    // 文件名称 ts/Car1.ts
    class Car1{
       test1():void{
           logd("i am car1.")
       }
    }
    export ={Car1}
  • 在其他js文件中调用 
    // 文件名称 js/main.js
    function main(){
        let car = require("ts/Car1")
        let car1 = new car.Car1();
        car1.test1()
    }

js和ts混编建议​

提示
  • 为了安全 建议脚本的js和ts文件都放到js文件夹下编写
  • 为了安全 建议UI的js和ts文件都放到subjs文件夹下编写
  • 如果存在工程引用，js文件夹下的可以直接使用，包括js和ts文件，其他文件下的ts无法被另外工程引用
  • 以上的建议无需使用require即可直接使用，如果非要使用require模式，将js和ts文件放到非js文件夹，建议混淆js文件
  • ts文件编译后的js会参与iec的编译，ts源文件不会