node 是怎样把多个JS模块链接在一起的？

废话开篇：有时候是不是会有这样的疑问：纷繁的功能文件，到最后是怎么组合成起来并且在浏览器中展示的？为什么需要 node 环境？

一、个人理解

浏览器本身只能做一些展示及用户交互的功能，对于系统操作的能力很有限，那么，浏览器内置的运行环境显然不满足一些更为人性化的开发模式，比如：更好的区分功能模块、实现文件的操作。那么，带来的缺陷就很明显，比如：各个 JS 文件比较分散，需要在 html 页面里面单独引入，如果某个 JS 文件需要其他的 JS 库，那么很可能会因为 html 页面未引入而报错，在功能庞大的项目里，手动的管理这些功能文件确实让人有点捉襟见肘。

那么， node 到底是怎么更友好的提供开发的呢？其实，上面也说了，人为的管理文件依赖不但会消耗大量的精力，还会存在疏漏，那么，是不是以用自动化的方式进行管理就会好很多？是的，在 node 的运行环境里拓宽了对系统的操作能力，也就是说，或许以前开发者也想通过一些代码来完成那些机械琐碎的工作，但是，只有想法没有操作权限，最后只能望洋兴叹。现在，可以以 node 的一些扩展功能对文件进行先前加工与整理，再添加一些自动化的代码，最后转换为一个浏览器可识别的、完整的 JS 文件，这样一来，多个文件的内容，便可以汇集到一个文件。

二、创建文件

先创建一些 JS 文件，如下图所示：

这些文件都是手动创建，babel-core 这个文件是从全局的 node_modules 里面复制出来的，如下图所示：

为什么要复制出来呢？这是因为，任何脚手架干的事其实都是为了快速搭建，但是，怎么能理解它干的什么事呢？那干脆就直接复制吧，本身，node 除了一些内置的模块，其他的都需要通过指明 require 路径的方式来找到相关模块，如下图所示：

通过 require(‘./babel-core’) 方法，解析一个功能模块下的方法。

1、编写入口文件，转换ES6代码

entrance.js 作为入口文件，作用就是设定工作从哪开始？怎么开始？那么，这里的工作指的就是转换ES6代码，以提供浏览器使用。

//文件管理模块
const fs = require('fs');
//解析文件为AST模块
const babylon = require('babylon');
//AST转换模块
const { transformFromAst } = require('./babel-core');
//获取JS文件内容
let content = fs.readFileSync('./person.js','utf-8')
//转换为AST结构，设定解析的文件为 module 类型
let ast = babylon.parse(content,{sourceType:'module'
})
//将ES6转换为ES5浏览器可识别代码
le t { code } = transformFromAst(ast, null, {presets: ['es2015']
});
//输出内容
console.log('code:\n' + `${code}`) 

上面的代码很简单，最终的目的就是将 module 类型的 person.js 文件转换为 ES5。

let person = {name:'wsl'}
export default person 

终端运行入口文件，如下所示：

node entrance.js