📜  如何在 Node.js 中有路径别名?

📅  最后修改于: 2022-05-13 01:56:35.876000             🧑  作者: Mango

如何在 Node.js 中有路径别名?

Node.js 有大量难以处理的模块。因此,拥有一个整洁且定义明确的目录结构是一种很好的做法。

在本文中,我们将处理一个涉及 Node.js 模块的问题。让我们首先了解什么需要有路径别名。

在使用 Node.js 时,我们必须处理很多依赖项、模块和相对路径。键入路径和导入 Node.js 模块很容易出错并且很累人。像 IntelliSense 这样的代码完成功能可以提供很多帮助,但是随着代码库的增长,这可能会变得具有挑战性。更改项目的目录结构会导致在整个项目中多次引用的所有模块发生变化。项目维护工作量大、容易出错、混乱和累人。

下面是我们每次需要使用模块时需要导入的相对路径的示例。

相对路径示例:

Javascript
import React, { component } from 'react';
const Module_Name = require('../../../../../../../../Module_Name');
import Icon from '../atoms/Typography';
import { userFetchRequest } from '../../../store/actions';


Javascript
// Aliases
"_moduleAliases": {
  "@root"      : ".", // root directory
  "@deep"      : "src/some/deep/directory/or/file",
  "@my_module" : "lib/some-file.js",
  "something"  : "src/foo", // Or without @. It could be any string
}
   
// following is optional
// Custom module directories, same as 
//`node_modules` but with private modules
"_moduleDirectories": ["node_modules_custom"],


Javascript
require('module-alias/register')


Javascript
require('name_of_module_you_require')
const module = require('@root/some-module')
const veryDeepModule = require('@deep/my-module')
  
// module from `node_modules_custom` directory
 const customModule = require('my_private_module') 
  
// Or ES6
import 'name_of_module_you_require'
import module from '@root/some-module'
import veryDeepModule from '@deep/my-module'
  
// Module from `node_modules_custom` directory
import customModule from 'my_private_module'


这就是使用路径别名的原因。

别名表示文件路径或 URL,以避免键入整个绝对路径或 URL。路径别名使一切变得简单而紧凑,从而减少了键入,更好地理解目录结构,易于维护和更少的错误。有不同的方法可以实现这一目标;从配置 webpack resolve (React)、使用模块别名,或者在 TypeScript 的情况下配置tsconfig文件中的 baseUrl 和路径。

方法:

注册别名module-alias修改内部Module._resolveFilename方法,以便当我们导入任何模块时,它首先将名称与已注册别名之一匹配,如果匹配,则建议并导入已经存在的模块。 module-alias修改内部Module._nodeModulePaths以便当前目录表现为 node_modules 目录。

要遵循的步骤:

使用module-alias创建目录的别名并在 NodeJS 中注册自定义模块路径。

我们先安装module-alias

句法:

输出:

安装后的预期结果

安装后,将以下代码添加到您的 package.json 文件并根据需要进行配置。

注意:删除json文件中的所有注释以防止lint-errors。

Javascript

// Aliases
"_moduleAliases": {
  "@root"      : ".", // root directory
  "@deep"      : "src/some/deep/directory/or/file",
  "@my_module" : "lib/some-file.js",
  "something"  : "src/foo", // Or without @. It could be any string
}
   
// following is optional
// Custom module directories, same as 
//`node_modules` but with private modules
"_moduleDirectories": ["node_modules_custom"],

您的json文件将如下所示:

之后,将此行添加到应用程序主文件 ( index.js ) 的最顶部,在任何代码之前。

Javascript

require('module-alias/register')

上面的代码注册了您的别名。如果您在我们的 IDE 中有 IntelliSense,它会自动得到建议。

最后,您可以看到变化。

Javascript

require('name_of_module_you_require')
const module = require('@root/some-module')
const veryDeepModule = require('@deep/my-module')
  
// module from `node_modules_custom` directory
 const customModule = require('my_private_module') 
  
// Or ES6
import 'name_of_module_you_require'
import module from '@root/some-module'
import veryDeepModule from '@deep/my-module'
  
// Module from `node_modules_custom` directory
import customModule from 'my_private_module'

最终输出:

在下图中,您应该能够在 VS 代码中看到 Intellisense 建议的模块别名(@sendgrid/mail 是预期结果的示例)

Intellisense 建议模块别名