加载模块与导入模块的区别(什么是模块,导入模块有哪几种方法）

我们都知道Vue如此受大众欢迎的原因之一就是它的组件开发模式，不仅提高了组件的复用性，而且每一个Vue组件都是Vue的一个实例，可以接受相同的option对象，提供相同的生命周期钩子。这使得项目调试更加简单方便，整个开发效果更高，可维护性更强，也适合多人协同开发。我们在看别人的项目时，经常会在文件中看到require和import，用来介绍模块化编程。那么这两者有什么区别呢？

？普通商品的起源

早期没有模块化思想的时候，代码写得不好，导致代码很多，逻辑重复，缺乏条理，管理维护困难，这也是很多开发者头疼的问题。随着JavaScript社区的发展，社区为JavaScript制定了相应的规范，CommonJS规范的提出得到了认可和广泛应用。2009年，CommonJS诞生。

CommonJS简介

CommonJS实现了Javascript的模块化规范，规范了模块的特性和模块之间的相互依赖关系，使得代码可以更好的编写和维护，提高了代码的复用性。每个定义文件都是一个模块(模块变量代表当前模块),并且有自己的作用域。每个文件中定义的变量、函数和类都是私有的，对其他模块不可见。模块的exports属性是一个外部接口，只有通过exports导出的属性才能被loading识别。Node是基于CommonJs规范实现的，因为CommonJs规范的加载模块是同步的，服务器中的节点模块直接存储在服务器的本地硬盘中，加载自然更快。可以说，节点工程是目前CommonJS规范最好的实际应用。

需要

Require是Node的内置函数，用于加载模块文件。require函数可以读取并执行JavaScript文件，然后返回模块的exports对象。module.exports变量(用于导出模块)和require函数(用于导入模块)是CommonJS定义的两个主要概念。module.exports属性表示当前模块与外界的接口。当其他文件通过require函数加载模块时，它们实际上读取了module.exports中的变量

ECMAScript 6(简称ES6)

ECMAScript是(欧洲计算机制造商协会脚本)的缩写，是ECMA国际标准化组织定制的JavaScript脚本语言的标准化规范。ECMAScript 6是ECMA在2015年发布的JavaScript标准，它解决了ES5的许多固有缺点，并引入了模块化的思想。ES6模块的设计思想是尽可能的静态，这样就可以在编译时确定模块的依赖关系和输入输出的变量。

进口

它是import ES6中的语法标准，也用于加载模块文件。import函数可以读取并执行一个JavaScript文件，然后返回模块的export命令指定的输出代码。export和export default都可用于导出常量、函数、文件和模块。可以有多个导出，并且只能有一个导出默认值。

要求和导入的区别

1.require是CommonJS规范的模块化语法，import是ECMAScript 6规范的模块化语法；

2、require是运行时加载，import是编译时加载；

3、要求可以写在代码的任何地方，导入只能写在文件的顶部，不能用在条件语句或函数的范围内；

4.“需要通过模块导出”导出的值不能改变，“导入通过导出”导出的值可以改变；

5;Require通过module.exports导出exports对象，import通过export导出指定输出的代码；

6.模块的性能相对较低，因为require运行时引入了模块的属性，而导入编译时引入的模块性能稍高。

require的使用

定义：module变量表示当前模块，其exports属性是外部接口。可以通过导出从模块中导出模块。用其他文件加载模块实际上是读取module.exports变量，变量可以是变量、函数、对象等。在节点中，如果使用导出进行导出，系统会帮助您将其转换为module.exports，但是需要定义导出名称。

加载模块：require方法用于加载带有js后缀的模块文件。如果参数字符串以“/”开头，则表示加载了具有绝对路径的模块文件。如果参数字符串以“.”开头。/，表示加载了相对路径的模块文件。模块被同步加载，并根据JavaScript运行时搜索的顺序进行处理。

进口的使用

定义：可以在模块中使用export关键字导出变量、对象、函数、类等。然后通过import语句使用它们。一个模块中只能有一个默认导出默认值，但可以有多个导出导出。

加载模块：导入加载模板可以多种形式加载，如整个模块的内容、单个接口、多个接口、带别名的接口、默认值等。通过这种方式，可以按需加载模块，并提高代码的性能。

更多Vue实用技巧请参考专栏：Vue实用系列