关于前端:带你了解NodeJs的模块系统

30次阅读

共计 1966 个字符,预计需要花费 5 分钟才能阅读完成。

前言

在 JavaScript 语言中,两个独立的 js 脚本相互援用是无奈实现的,只能在 Html 页面中引入多个脚本来做到关联。

NodeJs 提供了一个简略的模块零碎,它让 Js 代码之间能够相互援用,不便裸露本人的调用办法给他人应用。

引入模块示例 A

文件名:jsjiami.js

exports.hello = function() {console.log('Hello World');
}

exports.jiami = function (code) {return `js 一键加密 | jsjiami.com -> ${code}`;
}

/*----------*/

/*const CORE = {test: function () {console.log('test');
    },
    test1: function () {console.log('test1');
    }
}

module.exports = CORE;*/

文件名:main.js

const {jiami, hello} = require("./test/jsjiami");

const str = jiami('js 一键加密 | jsjiami.com');
console.log(str);

hello();

/*
const CORE = require('./test/jsjiami');
CORE.test1();
*/

敲代码肯定要多入手,以上代码能够丢到编译器中运行一下试试是否失常运行,作者用的是 WebStorm。

示例 A 解析

以上示例很简略,通过 exports 导出了一个名字为 jiami 的函数,将该函数裸露了进来。

而后在 main.js 文件中援用了这个函数,通过的 require 关键词和 {} 将须要引入的函数引入进来就能够间接应用了。

或者看正文局部,也能够不必{},间接引入当变量调用办法。

引入模块示例 B

文件名:jsjiemi.js

export const hello = function () {console.log('hello word');
}

export const jsjiemi = function () {return 'js 一键解密 | jsjiami.com';}

export default {test: function () {console.log('test');
    },
    test1: function () {console.log('test1');
    },
    jsjiemiDefault: jsjiemi
}

文件名:main.js

import {jsjiemi, hello} from "./test/jsjiemi.js";

const str = jsjiemi();
console.log(str);

hello()

import CORE from "./test/jsjiemi.js";
CORE.test();
CORE.test1();
const str1 = CORE.jsjiemiDefault();
console.log(str1);

仍然依照常规啊,敲代码的,能入手就入手,先跑一边,再剖析,倡议各位先丢到本人的编译器中跑一下试试手感。

示例 B 解析

该实例是用 import 关键词来引入办法的,通过 export 关键词裸露函数。

export 后边必须跟的是申明,不能够是变量。

import{} 内引入指定 js 文件暴露出的办法,没裸露的无奈援用。

export default 后边必须跟一个对象,对象里边是你想裸露的任意代码或变量。

import xxx 不必 {} 间接自定义一个变量的用法,是联合 export default 一起用的,必须有 export default 才能够间接自定义一个变量去承受裸露的函数。

总结(有彩蛋)

以上介绍了 NodeJs 两种模块裸露和导入的形式。

我置信如果跟着我入手的读者会发现,示例 2 是会报错的,为什么呢?接下来为您解答哈哈。

NodeJs在更新 14 版本当前,分成了 2 种模块标准,一种是CJS,一种是ESM

而上述示例代码中,示例 A CJS 标准 的,示例 B ESM 标准 的。

NodeJs默认是 CJS 标准 的,如果你想用 示例 B exportimpot,须要在 package.json 中,减少 type 属性去指定模块标准,间接贴出来吧。

{
  "name": "bet",
  "version": "1.0.0",
  "description": "","main":"index.js","type":"commonjs", // commonjs=CJS module=ESM"scripts": {"test":"echo \"Error: no test specified\" && exit 1"},"keywords": [],"author":"jsjiami.com","license":"ISC"}

如果文章对您有帮忙,心愿能够点赞关注珍藏,谢谢!

有任何问题能够评论在下方,或者通过我的网站找到我 www.jsjiami.com

正文完
 0