Cocos Creator + TypeScript项目中使用npm loadsh包

最新推荐文章于 2025-01-18 17:37:26 发布

闪电松鼠7

最新推荐文章于 2025-01-18 17:37:26 发布

阅读量2.9k

点赞数 1

分类专栏： JavaScript TypeScript 游戏开发文章标签：小程序 cocos typescript js 小游戏

本文链接：https://blog.youkuaiyun.com/qq_35576100/article/details/103602230

版权

JavaScript 同时被 3 个专栏收录

6 篇文章

订阅专栏

TypeScript

1 篇文章

订阅专栏

游戏开发

1 篇文章

订阅专栏

本文介绍了如何在Cocos Creator的TypeScript项目中使用npm管理包，以lodash为例，详细阐述了从创建新工程到引入并使用lodash的深拷贝函数的步骤，最后在浏览器中成功运行验证。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Cocos Creator + TypeScript项目中使用npm loadsh包

Cocos Creator + TypeScript + npm

Cocos Creator + TypeScript + npm

本篇主要讲Cocos Creator的TypeScript项目中使用npm管理包的一种使用方法之一,并非所有的包都如下使用方法,但都大同小异

步骤1:创建新的工程

在这里插入图片描述
我创建了一个TypeScript语言的新的HelloWorld工程;

步骤2:npm装包

npm i lodash -save
npm i @types/lodash -save-dev

npm是安装node.js时附带的包管理工具
lodash是我们项目中实际用到的js代码包
types/lodash可以看到保存为开发环境,它实际上是一个由ts写的代码提示包,在项目编译中不会参与编译(大部分的主流npm包都有对应的ts代码提示包)

步骤3:代码中按需引入lodash函数

在HelloWorld.ts中,我决定引入深拷贝函数测试引入的包是否有问题

import cloneDeep = require('lodash/cloneDeep');

const obj = {
    age: 18,
    GetAge: function () {
        return this.age;
    }
}

const { ccclass, property } = cc._decorator;
@ccclass
export default class Helloworld extends cc.Component {

    @property(cc.Label)
    label: cc.Label = null;

    @property
    text: string = '';

    start() {
        this.label.string = this.text;

        const obj2 = cloneDeep(obj);

        console.log('source obj = ', obj);

        console.log('copy obj2 = ', obj2);

        console.log('is equal:', obj == obj2);
    }
}