錯誤 [ERR_MODULE_NOT_FOUND]：找不到模塊

Question

我正在開發一個節點項目（屏幕截圖）。 我在 helpers.js 中有一個 function （網址），我在底部導出為：

module.exports = {
urls: urls,
};

在我的 index.js 中，我嘗試使用以下命令導入它：

import { urls } from './helpers';
const myUrls = urls(1,3);

當我運行它時，我得到

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/home/optionhomes11/nodeprojects/hayes/helpers' imported from /home/optionhomes11/nodeprojects/hayes/index.js Did you mean to import ../helpers.js?

我究竟做錯了什么？

Answer 1

你用過

"type":"module"

然后確保你有import文件必須是.js擴展名

Answer 2

您應該從'./helpers'導入，而不是'.helpers' 。

Answer 3

試試這個如下

在您的"/home/optionhomes11/nodeprojects/hayes/index.js"中搜索

並尋找"/home/optionhomes11/nodeprojects/hayes/helpers"

改變

"/home/optionhomes11/nodeprojects/hayes/helpers"

至

"/home/optionhomes11/nodeprojects/hayes/helpers.js"

Answer 4

你沒有做錯什么。 文件擴展名的 EcmaScript 模塊的當前解析算法和導入具有索引文件的目錄的能力需要使用實驗標志。 見esm ，底部。

所以讓你的工作保持原樣，而不是

$ node index.js

你做：

$ node --experimental-specifier-resolution=node index.js

您還可以在 package.json 中創建腳本

像這樣：

     "scripts": {
  "start": "NODE_OPTIONS='--experimental-specifier-resolution=node' node src/index.js

Answer 5

我還建議您安裝Path Intellisense VS 代碼擴展。 它在處理嵌套路徑時真的很有幫助。

Answer 6

當您使用 ECMAScript 模塊時，您必須提供文件擴展名： https://nodejs.org/api/esm.html#esm_mandatory_file_extensions

因此，除了在 package.json 上使用"type": "module"的其他建議之外，您還需要指定文件擴展名import {urls} from './helpers.js' 。 您還可以使用標志--es-module-specifier-resolution=node使其將 js 文件解析為模塊，就像之前使用require所做的那樣

Answer 7

//helpers.js

export default urls;

//index.js

import urls from './helpers.js';

//package.json（名稱下）

"type": "module"

Answer 8

發生這種情況是因為在使用 ES 模塊時，我們被強制在 import 語句中指定文件擴展名

import * from "./demo.js" // Works fine
import * from "./demo" // Will throw error as you see

注意：以上兩個選項在使用 commonJs 時都有效

Answer 9

//如果你改變package.json試試這個

npm i

Answer 10

答案 1

此答案不需要在執行時使用運行時標志--es-module-specifier-resolution=node

但是，你必須修改你的 ts 源代碼，如果有很多文件，這會很痛苦。 而且，修改后的文件將不再在“commonjs”模式下編譯，如果你想 go 回來或使用雙重“commonjs”/“module”模式。

修改您的tsconfig.json以確保至少以下設置版本：

   compilerOptions:{
    "lib": ["es2020"],
    "module": "ES2022",
    "moduleResolution": "node",
    "target": "es2022",
   }

適用於 typescript 4.6.3。 （請注意 4.6.1 或更低版本）。 *

修改index.js

import {urls} from "#helpers";

修改package.json

  "imports": {
    "#helpers": "./helpers.js"
  }

前導“#”是強制性的

答案 2

除了不需要節點運行時執行標志之外，這個答案還滿足：

1. 不需要更改您的*.*ts源代碼（因此，如果您選擇這樣做（*note），則可以在 commonjs 下編譯它）
2. 如果您正在生成一個庫，它會生成 output 可以由“commonjs”或“模塊”客戶端使用。

(*note) 使用 rollup 時，需要內聯映射 - 因此在開發期間使用 commonjs 並切換到“模塊”進行發布有時可能會有優勢。

首先修改package.json ，創建rollup.config.js ，然后使用rollup執行 post tsc動作。

package.json

...
"exports":{
  "require":"./index.cjs",
  "import":"./index.js"
},
"types": "./index.d.ts",
"type": "module"    // you already had this

rollup.config.js

// import resolve from "@rollup/plugin-node-resolve";
import dts from "rollup-plugin-dts";
import commonjs from "@rollup/plugin-commonjs";
import * as path from "path";
import pkg from "./package.json";

export default [
  {
    input: "index.js",
    external:[], // you may quash 'unresolved' warning by adding here
    output: [
      { file: pkg.exports.require, format: "cjs" },
      { file: pkg.exports.import, format: "es" },
    ],
    plugins: [
      commonjs(),
    ],
  },
  {
    input: "./index.d.ts",
    output: [
      { file: pkg.types, format: "es" }, 
    ],
    plugins: [dts()],
  },
];

調用tsc然后rollup ：

npx tsc 
npx rollup -c