如何在 Node.js 中使用 import / export 的三种方法

2019-08-07 17:16:53

如何在 Node.js 中使用 import / export 的三种方法

因为一些历史原因,虽然 Node.js 已经实现了 99% 的 ES6 新特性,不过截止 2018.8.10,How To Enable ES6 Imports in Node.JS 仍然是老大难问题


下面我来介绍三种方法可以让我们在 Node.js 中使用 import/export 。


注:第1、2种方法均是借助 babel,需要注意的是文章使用的babel版本 < 7。从 babel 7.X 版本开始,部分包名、用法发生了些许变化,大体与7之前的用法类似,详细请到官方手册学习 7.X 版本的改动(Babel 踩坑总结(三) —— 7.X 版本升级是我对 7.X 版本三大改动的总结)


1. 使用 babel-register

1.1 下载必须的包

npm install babel-register babel-preset-env -D

1

1.2 修改你的 server.js

下面是一个 server.js 的例子:


const Koa = require('koa')

const app = new Koa()


app.listen(8225, console.log("application is start at port 8225"))

1

2

3

4

用 import 替换 require


import Koa from 'koa'

const app = new Koa()


app.listen(8225, console.log("application is start at port 8225"))

1

2

3

4

如果你现在用 node server.js 跑这个文件,你会收到像这样的错误提示:


/Users/zwkkkk1/myStudy/demo/chatroom/server/app.js:1

(function (exports, require, module, __filename, __dirname) { import Koa from 'koa'

                                                                     ^^^


SyntaxError: Unexpected identifier

1

2

3

4

5

下面让我们用 babel 来解决这个问题


1.3 新增一个 start.js 文件

这个文件将成为我们的入口文件,里面是一些 babel 的代码


require('babel-register') ({

    presets: [ 'env' ]

})


module.exports = require('./server.js')

1

2

3

4

5

注意,接下来不是 node server.js,而是用 node start.js 来启动这个文件


2. 使用 babel-node 命令

如果你不想添加新的文件也可以,这里需要在命令行中使用 babel-node 命令。babel-node 命令不是独立安装,在 Babel 7.X 版本前,需要通过安装 babel-cli 包获得;在 Babel 7.X 版本,需要安装 @babel/core、@babel/cli 两个包。


此处以 7.X 之前的版本举例,7.X 版本可去官网查找对应包的使用用例


安装必要的插件


全局安装 babel-cli


npm install babel-cli -g

1

安装 babel-preset-env


npm install babel-preset-env -D

1

然后原来是 node server.js,改为这样调用:babel-node --presets env server.js


需要注意的是如果只是为了 babel-node 这一个命令,安装 babel-cli 会加载安装很多资源和模块,出于性能考虑不推荐在生产环境使用。自己在开发调试的时候,可以鼓捣着玩玩


3. 来自 Node.js 官方的力量

Node 9提供了一个尚处于 Experimental 阶段的模块,让我们可以抛弃 babel 等一类工具的束缚,直接在 Node 环境下使用 import/export。


官方手册:ECMAScript Modules

一个不错的教程:Node 9下import/export的丝般顺滑使用

有兴趣的可以去了解一下,嫌字多的可以继续往下看看我总结的使用方法


用前须知

Node 版本需在 9.0 及以上

不加 loader 时候,使用 import/export 的文件后缀名必须为 .mjs

举个例子,还是用上面的例子,请将代码回退到 Babel 中第一步的样子


3.1 改写 server.js

import Koa from 'koa'

const app = new Koa()


app.listen(8225, console.log("application is start at port 8225"))

1

2

3

4

和前面一样,不过将文件名改一下,从 server.js 改为 server.mjs


3.2 启动文件

执行下面代码,来启动文件


node --experimental-modules ./server.mjs

1

注意这是引用 koa 第三方模块不用做其他变化,如果要 import 自己的文件,那么那个待引入的文件也要改后缀。


比如


import example from './example'

1

那么原来应该是 example.js 要改为 example.mjs


目前这个模块还处于实验阶段,还是不要放到生产环境,自己拿出来玩玩还是可以的,


  • 2020-11-17 09:56:02

    uni-app直接用webiew打开本地js资源

    如果再结合activity不销毁,隐藏的方法,像里面传递参数,来改变页面,不销毁webview,我发现这样比原生的都要快。这样又能用于app端,又能生成小程序,何乐而不为

  • 2020-11-17 09:59:05

    在线图片取色器工具

    不知道为啥,现在idea的取色工具怎么都不好使了,给开发人员反映过,都一年了有没修复咋地。 网上搜到一个取色工具,把图片传上去,就可以点击取色。不错。

  • 2020-11-17 10:05:53

    mongoDB 修改密码

    mongodb的用户信息是存放在system.users表中的,修改密码不能直接更新表数据,这样的话,存到表里的密码是明文的,这就不对了。

  • 2020-11-17 10:13:16

    Vue.observable()进行状态管理

    随着组件的细化,就会遇到多组件状态共享的情况, Vuex当然可以解决这类问题,不过就像 Vuex官方文档所说的,如果应用不够大,为避免代码繁琐冗余,最好不要使用它,今天我们介绍的是 vue.js 2.6 新增加的 Observable API ,通过使用这个 api 我们可以应对一些简单的跨组件数据状态共享的情况。

  • 2020-11-17 10:17:18

    MongoDB日志文件查看

    默认情况下,MongoDB在此路径/var/log/mongodb/mongodb.log创建日志文件,如果找不到该日志文件,请检查MongoDB配置文件。

  • 2020-11-17 11:57:16

    app抓包无数据

    我们经常在wifi设置中 设置代理到我们的pc http代理软件上,多数情况下,此时我们开启的app流量都可以在代理软件上看到,比如charles , fiddler等等。 但是细心的人会发现 某些大厂的app 某些请求 在这些 http代理软件上就是抓不到, 给人的感觉就是 流量没从代理软件走一样。

  • 2020-11-17 11:57:55

    app抓不到包,解决很简单

    1.手机安装virtualXpost 并激活xpost 框架,如有问题自行百度。 2.安装justTrustMe,然后再virtualXpost中添加此模块 3.安装手机抓包神器packet capture 4.在virtualXpost中运行app,并打开packet capture抓包就行