npm包import-package使用教程

当我们在进行前端开发时，可能需要使用一些第三方的库或插件，而npm就是个非常好的选择。npm是javascript的包管理器，可以用来查找、安装以及管理项目需要使用的库或插件。import-package是npm包中的一个重要概念，通过它可以方便地使用我们需要的Library及功能。

import-package基础知识

在npm中，包（Package）是一个预先封装好的代码文件夹，其中包含了需要的JS代码，还有足以让代码完成工作的任何资源。导入（import）则是将包中的一个或多个模块导入到本地代码中，以供使用。下面我们来看看如何使用import-package。

安装 import-package

首先，我们需要在项目中的终端中输入以下npm安装命令，以便使用import-package。

npm install import-package --save

使用 import-package

在Node.js中，导入一个模块的方法是使用require()函数。当引入的是外部模块时，Node.js将会到node_modules文件夹中查找对应的模块。import-package则是对于ES6的import方法进行了一定的封装。我们可以简单地使用import-package来导入一个包中的模块：

import {moduleName} from 'packageName'

其实现方式有两种，一种是直接使用ES6中的import方法，另一种是使用require()函数，这里为大家介绍一下具体的使用方法。

使用ES6中的import方法导入

我们可以使用ES6的import方法导入一个已安装在本地项目中的包。例如，我们需要从react区这个包中导入其DOM渲染功能，则我们需要使用以下代码：

import {render} from 'react-dom'

在这个例子中，{render}是草泥马外部包的一部分，而'react-dom'则是这个包的名称。你需要在你的项目中安装这个包之后，才可以使用这个行为。

使用 require()函数导入

Node.js中，我们需要用require()来导入其他模块。Node.js会从node_modules文件夹中查找对应的模块。同样的，我们可以使用import-package来导入一个已安装在本地项目中的某个模块，并返回模块。

const moduleName = require('packageName')

例如，我们需要在引入React包的情况下，导入ReactDOM。可以使用以下代码：

const ReactDOM = require('react-dom')

import-package使用示例

下面我们以一个简单的例子来介绍import-package的使用方法。

首先，我们需要在项目中安装moment.js这个包。在终端中输入：

npm install moment --save

安装完成后，我们需要在在我们的代码中引入和使用该模块。我们可以使用以下两种方法中的任何一种来进行导入：

import moment from 'moment'
const moment = require('moment')

使用ES6的import方法导入后，在需要的地方使用moment()调用即可。例如，我们在一个Vue组件中的method中使用moment输出当前时间：

export default {
  methods: {
    showCurrentTime() {
      console.log(moment())
    }
  }
}

使用require()函数导入后，在需要的地方使用moment()调用即可。例如，在Node.js项目中，输出当前时间：

const moment = require('moment')
console.log(moment())

总结

• import-package是npm包中的一个重要概念，用于方便地使用我们需要的Library及功能。
• 我们可以使用ES6的import方法或使用require()函数来导入一个已安装在本地项目中的包或模块。
• import-package的使用可以大大方便我们前端开发中对各种第三方的依赖。

npm包import-package的使用并不复杂，但需要我们多加练习和应用。当我们灵活应用该功能时，可以大大提高前端开发的效率，实现工程化开发的目标。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f0020bf403f2923b035bc6d