当执行 import vue from ‘vue’ 时发生了什么？

平时开发中，经常会用到这样一个语句：

script
import Vue from 'vue';

由于浏览器兼容性问题，通常这个语法是在 webpack 的构建流搭建的项目中执行的，那么这个语句到底做了什么呢？
其实在 nodejs 中，执行 `import` 就相当于执行了 `require`，而 `require` 被调用，其实会用到 `require.resolve` 这个函数来查找包的路径，而这个函数在 nodejs 中会有一个关于优先级的算法。先看一下 `import Vue from 'vue'` 这一句做了什么：
1. `import Vue from 'vue'` 解析为 `const Vue = require('vue')`。
2. `require` 判断 vue 是否未 nodejs 核心包，如我们常用的：path，fs 等，是则直接导入，否则继续往下走。
3. vue 非 nodejs 核心包，判断 vue 是否未 '/' 根目录开头，显然不是，继续往下走。
4. vue 是否为 './'、'/' 或者 '../' 开头，显然不是，继续往下走。
5. 以上条件都不符合，读取项目目录下 node_modules 包里的包。
到了第五步，`import Vue from 'vue'` 就找到了 vue 所在的实际位置了，那么问题来了，node_modules 下的 vue 是一个文件夹，而引入的 Vue 是一个 javascript 对象，那它是怎么取到这个对象呢？
其实对于一个 npm 包，内部还有一个文件输出的规则，先看下 node_modules/vue 下的文件结构是怎么样的：
bash
├── LICENSE
├── README.md
├── dist
├── package.json
├── src
└── types

是不是看起来很笼统，其实对于 npm 包，`require` 的规则是这样的：
1. 查找 package.json 下是否定义了 main 字段，是则读取 main 字段下定义的入口。
2. 如果没有 package.json 文件，则读取文件夹下的 index.js 或者 index.node。
3. 如果都 package.json、index.js、index.node 都找不到，抛出错误 `Error: Cannot find module 'some-library'`。
那么看一下 vue 的 package.json 文件有这么一句：
json
{
...
"main": "dist/vue.runtime.common.js",
...
}

到这里就很清晰了：

script
import vue from 'vue';
// 最后转换为
const vue = require('./node_modules/vue/dist/vue.runtime.common.js');

而 vue.runtime.common.js 文件的最后一行是：`module.exports = Vue;`，就正好跟我们平时使用时的 `new Vue({})` 是一致的，这就是 `import vue from 'vue'` 的过程了。
当然，这个是我们平时使用得最多的导入方式，还有其他一些导入规则，都可以在 [nodejs 的文档](https://nodejs.org/api/modules.html#modules_all_together) 中找到。