为啥我需要使用已安装库的相对路径？

Posted 2023-02-16

【中文标题】为啥我需要使用已安装库的相对路径？

【英文标题】：Why I need to use a relative path to an installed library?为什么我需要使用已安装库的相对路径？

【发布时间】：2021-02-20 12:30:04

【问题描述】：

背景： 我正在尝试将 Editor.js 库用于个人项目

Editor.js documentation

有项目目录：

有 package.json ：

  "name": "quicknoteapp",
  "version": "1.0.0",
  "description": "",
  "main": "myApp.js",
  "scripts": 
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron ."
  ,
  "author": "",
  "license": "ISC",
  "devDependencies": 
    "@editorjs/editorjs": "^2.19.0",
    "electron": "^10.1.5",
    "menubar": "^9.0.1"
  

我的index.html：

<script type="module" src="main.js"></script>

我从main.js 导入我的库：

import EditorJS from '@editorjs/editorjs';

最后，控制台出现了这个错误：

TypeError: Module specifier, '@editorjs/editorjs' does not start with "/", "./", or "../". Referenced from file:///Users/charles/Desktop/QuickNoteApp/main.js

好的，我需要在导入模块时添加相对路径。但我不喜欢这样做。 为什么我需要使用已安装库的相对路径？

为什么我不能像文档那样做？在项目设置期间我做错了什么？我认为将路径添加到每个脚本是不正常的。如果没有，为什么要使用 npm... 并得到一个 node_module 文件夹。

【参考方案1】：

NPM 旨在管理 Node.js 的包，而不是 Web 浏览器。

Web 浏览器不是 Node.js。它们不支持 Node.js 的模块路径解析功能（这涉及在多个目录中搜索匹配文件：Web 浏览器无法访问目录列表，只能访问 URL）。

这些说明假设您使用的是 Webpack 之类的工具，它使用 Node.js 将 JS 模块捆绑到单个文件中以交付给浏览器。他们不假设您要将模块直接加载到浏览器中。