Javascript 导入包无法解析模块说明符答案

【问题标题】：Javascript import package Failed to resolve module specifierJavascript 导入包无法解析模块说明符
【发布时间】：2021-02-19 18:04:05
【问题描述】：

我正在尝试导入我用 npm 下载的模块。

我的json文件是：

{
  "name": "nodejs-web-app1",
  "version": "0.0.0",
  "description": "NodejsWebApp1",
  "main": "server.js",
  "author": {
    "name": ""
  },
  "dependencies": {
    "fs": "^0.0.1-security",
    "http": "^0.0.1-security",
    "node-pandas": "^1.0.5",
    "node-static": "^0.7.11",
    "require": "^2.4.20",
  },
}

我有我的 html 文件：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>Home</title>
    <script type="module" src="functions.js"></script>
    <link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
    <h1>Dashboard</h1>
    <p>Welcome!</p>
    <button onclick="scraper()">CLICK</button>
    <label id="label">Reponse</label>
</body>

</html>

我的 functions.js 文件

import pd from 'node-pandas';
function scraper() {
    const s = pd.Series([1, 9, 2, 6, 7, -8, 4, -3, 0, 5])
    console.log(s);
    document.getElementById('label').innerHTML = 'A computer science portal for geeks';
}

还有我的 server.js 文件：

var nStatic = require('node-static');
var http = require('http');
var fs = require('fs');
var port = process.env.PORT || 8080;

var file = new nStatic.Server(__dirname);

http.createServer(function (req, res) {
    file.serve(req, res);
}).listen(port);

但运行代码时出现错误

未捕获的类型错误：无法解析模块说明符“node-pandas”。相对引用必须以“/”、“./”或“../”开头。

我试过了，但它也给出了另一个错误。

如果我写：

import pd from './node-pandas';

或

import pd from '../node-pandas';

我明白了：

GET http://localhost:1337/node-pandas net::ERR_ABORTED 404（未找到）

我的项目有这样的结构：

我的项目
- server.js
- functions.js
- index.html
- package.json
- node_modules
  - 节点熊猫

我正在使用 Visual Studio 2019

知道我做错了什么吗？

【问题讨论】：

标签： javascript

【解决方案1】：

import pd from './node-pandas';

还要检查您的 node-pandas 中是否有任何默认导出。如果在这种情况下没有默认导出，则必须使用

import { moduleName } from './node-pandas';

这里的模块名称将与导出它的名称完全相同，并且用于多个进口你应该用逗号分隔它们

希望这能解决您的问题

【讨论】：

它不起作用。我用 Visual Studio 创建了一个项目，并用 npm 安装了这个包。所以我不知道 node-pandas 是否有默认导出..

【解决方案2】：

const pd = require("node-pandas")

使用 require 代替 import 关键字可能会起作用，因为 import 是 es6 和 es7 特定的
另一方面，Node 项目中的常规 js 支持 require

【讨论】：

我收到另一个错误。 functions.js:2 Uncaught ReferenceError: require is not defined at functions.js:2

【解决方案3】：

我遇到了完全相同的问题（我完全是初学者）。

我通过 NPM 安装了一个依赖项，并且在该项目中他们使用了类似的 import 语句

import pd from './node-pandas';

而不是

import pd from './node-pandas.js';

所以我遇到了这样一种情况，即 Live Server 在“http://localhost/scriptname.js”上托管 javascript 文件，而项目正在“http://localhost/scriptname”上寻找该文件（没有.js 扩展名）

我当然可以将 .js 添加到导入语句中，但是我必须为这个外部项目的所有文件上的所有导入语句执行此操作。

奇怪的是，关于这个错误的信息并不多，但总结一下：

存在模块说明符和相对导入引用：https://sbcode.net/threejs/module-specifiers/
您只能使用相对导入引用。如果您想使用模块说明符，则需要一个工具来解决这些问题
此类工具的一个示例是 WebPack。它将为您解析所有这些导入语句并生成一个 javascript 文件，而不是您可以添加到您的 html 文件中

【讨论】：

【解决方案4】：

您需要提供模块的相对路径，例如“assets/node-pandas/dist/node-pandas”

【讨论】：

【解决方案5】：

import pd from 'node-pandas';

## 这里 node-pandas 模块位于某种根目录中##

我建议在您的模块名称之前使用 ./ 或 ../，提供的信息不足以提供解决方案

【讨论】：