目录
js模块化
怎么使用
总结
首页 web前端 js教程 浅析node中怎么使用import语法

浅析node中怎么使用import语法

Mar 21, 2023 pm 06:53 PM
nodejs​ node import

node.js支持import语法,很简单一个知识点,但是却能提醒我们从知识误区里走出来,多关注外边的知识世界,不断打开自己的知识边界。

浅析node中怎么使用import语法

js模块化

前端主流模块化规范,目前有以下几种:

  • CommonJS, Node.js提出的规范
  • ECMAScript Module,ESM,由ECMAScript组织提出的JavaScript标准规范
  • 已淘汰的有:CMD、AMD等,再就综合体UMD(支持各种规范的集合体)

因此,主流有两种规范CommonJSESM两种规范,但是由于Node.js不支持ESM规范,导致很多时候我们的项目里面并存两种规范的代码,从而出现下面这种情况:

// 在node端执行构建的时候
const _ = require('loadsh')

// 在浏览器端实现的时候
import _ from 'loadsh';
登录后复制

这样子开发就很容易出现痛点,往往我们的解决方案就是通过各种构建工具去解决,如:webpack vite,尤其是我们在写项目中写node.js编译脚本,经常需要切换。【相关教程推荐:nodejs视频教程编程教学

但是从Node.js V14+版本后,它开始支持ESM规范啦,你可以直接在Node.js中使用import export等语法了,终于等到这一天?。

PS: 其实早在Node.js V8.5版本就已经加入该特性了,只不过一直需要通过全局变量–experimental-modules去开启这一特性,由于不稳定性大多数项目都没有开启,不过自从16+后,我们就可以大胆放心在项目中使用了,不过一些古老的项目建议暂时不用开启。

怎么使用

我们先从官网上去看相关使用说明:

Node.js 有两个模块规范:CommonJS模块规范 和 ECMAScript模块规范 开发者可以通过 .mjs 文件扩展名、package.json中设置type=modulenode xxx.js --input-type 标志告诉 Node.js 使用 ECMAScript规范去执行代码。 如果没这些设置,Node.js 将使用 CommonJS 去执行。Node.js Modules: ECMAScript modules

通过上述我们就可以知道几个使用方式:

  • 将文件后缀改为.mjs,node.js加载的时候自动会用ESM规范

  • 在项目中package.json新增配置项"type":"module",那么整个项目中的.js文件都会按照ESM规范去执行

  • 增加执行参数--input-type也可以实现相同效果

各种使用方式

1、常规方式:

import _ from 'lodash';

import { readFile } from 'fs';

import Demo from './Demo.mjs'; // 绝对路径或相对路径都可以

export readFile;
export default readFile;
登录后复制

2、带参数的使用:

// 由于参数不同, 这个会让`foo.mjs`被加载两次,而不会利用缓存中的`foo.mjs`
import './foo.mjs?query=1'; // loads ./foo.mjs with query of "?query=1"
import './foo.mjs?query=2'; // loads ./foo.mjs with query of "?query=2"
登录后复制

3、支持data:格式URL的形式

import 'data:text/javascript,console.log("hello!");'; // text/javascript 会将后面的内容当成js模块
import { test } from 'data:text/javascript,function test(){console.log("test")};export {test};'; // 这里我们是不是扩宽思路,直接加载在线js呢?

import _ from 'data:application/json,"world!"' assert { type: 'json' }; // application/json 则是json

// application/wasm for Wasm
登录后复制

4、assert断言(实验特性) 将文件强制加载为某种格式内容,如:json javascript webassembly

import fooData from './foo.json' assert { type: 'json' };
登录后复制

5、加载commonjs规范模块

当然肯定也支持加载commonjs规范的模块,用法如下:

import { default as cjs } from 'cjs'; // module.exports 导出
import cjsSugar from 'cjs'; // module.exports
import * as m from 'cjs';
登录后复制

6、import() 异步导入 这种用法就很正常,不需要实时加载,等到需要用的时候再加载

const { default: barData } =
  await import('./bar.json', { assert: { type: 'json' } });
登录后复制

7、支持从http/https引入(实验特性)

目前属于实验特性,有限制,比如:

  • 不支持http2/3协议
  • http协议只能用于127.0.0.1等本地ip地址
  • Cookie、Authorization等信息不会携带发送
  • 只会加载执行远端的js文件,而不会加载远端中依赖其他文件
import worker_threads from 'node:worker_threads';
import { configure, resize } from 'https://example.com/imagelib.mjs';
configure({ worker_threads });
登录后复制

限制

唯一的限制:当开启ESM规范后,你只允许填写importexport,不允许使用requiremodule.exports,会报一下错误:

const a  = require('a')
           ^
ReferenceError: require is not defined in ES module scope, you can use import instead
    at file:///Users/borfyqiu/Desktop/study/github/qiubohong.github.io/code/demo-rollup/test.mjs:4:12
    at ModuleJob.run (node:internal/modules/esm/module_job:193:25)
    at async Promise.all (index 0)
    at async ESMLoader.import (node:internal/modules/esm/loader:530:24)
    at async loadESM (node:internal/process/esm_loader:91:5)
    at async handleMainPromise (node:internal/modules/run_main:65:12)
登录后复制

总结

其实这个也不算是冷门知识,只要稍微对Node.js有做持续关注,基本上都可以了解到该特性。

但是作为不关注的人,很容易就陷入自己的知识误区,会一直认为Node.js不支持ESM规范,甚至会吐槽Node.js为什么不支持呢?

所以这里有一句话需要提醒自己—— 【书山无路勤为径,学海无涯苦作舟】。

更多node相关知识,请访问:nodejs 教程

以上是浅析node中怎么使用import语法的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

nvm 怎么删除node nvm 怎么删除node Dec 29, 2022 am 10:07 AM

nvm删除node的方法:1、下载“nvm-setup.zip”并将其安装在C盘;2、配置环境变量,并通过“nvm -v”命令查看版本号;3、使用“nvm install”命令安装node;4、通过“nvm uninstall”命令删除已安装的node即可。

node项目中如何使用express来处理文件的上传 node项目中如何使用express来处理文件的上传 Mar 28, 2023 pm 07:28 PM

怎么处理文件上传?下面本篇文章给大家介绍一下node项目中如何使用express来处理文件的上传,希望对大家有所帮助!

深入浅析Node的进程管理工具“pm2” 深入浅析Node的进程管理工具“pm2” Apr 03, 2023 pm 06:02 PM

本篇文章给大家分享Node的进程管理工具“pm2”,聊聊为什么需要pm2、安装和使用pm2的方法,希望对大家有所帮助!

Pi Node教学:什么是Pi节点?如何安装和设定Pi Node? Pi Node教学:什么是Pi节点?如何安装和设定Pi Node? Mar 05, 2025 pm 05:57 PM

PiNetwork节点详解及安装指南本文将详细介绍PiNetwork生态系统中的关键角色——Pi节点,并提供安装和配置的完整步骤。Pi节点在PiNetwork区块链测试网推出后,成为众多先锋积极参与测试的重要环节,为即将到来的主网发布做准备。如果您还不了解PiNetwork,请参考Pi币是什么?上市价格多少?Pi用途、挖矿及安全性分析。什么是PiNetwork?PiNetwork项目始于2019年,拥有其专属加密货币Pi币。该项目旨在创建一个人人可参与

聊聊用pkg将Node.js项目打包为可执行文件的方法 聊聊用pkg将Node.js项目打包为可执行文件的方法 Dec 02, 2022 pm 09:06 PM

​如何用pkg打包nodejs可执行文件?下面本篇文章给大家介绍一下使用pkg将Node项目打包为可执行文件的方法,希望对大家有所帮助!

Python 的 import 是怎么工作的? Python 的 import 是怎么工作的? May 15, 2023 pm 08:13 PM

你好,我是somenzz,可以叫我征哥。Python的import是非常直观的,但即使这样,有时候你会发现,明明包就在那里,我们仍会遇到ModuleNotFoundError,明明相对路径非常正确,就是报错ImportError:attemptedrelativeimportwithnoknownparentpackage导入同一个目录的模块和不同的目录的模块是完全不同的,本文通过分析使用import经常遇到的一些问题,来帮助你轻松搞定import,据此,你可以轻松创建属

npm node gyp失败怎么办 npm node gyp失败怎么办 Dec 29, 2022 pm 02:42 PM

npm node gyp失败是因为“node-gyp.js”跟“Node.js”版本不匹配,其解决办法:1、通过“npm cache clean -f”清除node缓存;2、通过“npm install -g n”安装n模块;3、通过“n v12.21.0”命令安装“node v12.21.0”版本即可。

使用Angular和Node进行基于令牌的身份验证 使用Angular和Node进行基于令牌的身份验证 Sep 01, 2023 pm 02:01 PM

身份验证是任何Web应用程序中最重要的部分之一。本教程讨论基于令牌的身份验证系统以及它们与传统登录系统的区别。在本教程结束时,您将看到一个用Angular和Node.js编写的完整工作演示。传统身份验证系统在继续基于令牌的身份验证系统之前,让我们先看一下传统的身份验证系统。用户在登录表单中提供用户名和密码,然后点击登录。发出请求后,通过查询数据库在后端验证用户。如果请求有效,则使用从数据库中获取的用户信息创建会话,然后在响应头中返回会话信息,以便将会话ID存储在浏览器中。提供用于访问应用程序中受

See all articles