[英]Next.js + eslint: unable to resolve path to module 'fs/promises'
我啟動了一個 Next.js 應用程序並配置了 eslint。 我的開發依賴項列表是:
"devDependencies": {
"babel-eslint": "^10.1.0",
"eslint": "^7.21.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-prettier": "^8.1.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-react": "^7.22.0",
"eslint-plugin-react-hooks": "^4.2.0"
}
而 my.eslintrc 文件是:
{
"env": {
"browser": true,
"commonjs": true,
"es6": true,
"node": true
},
"parser": "babel-eslint",
"extends": [
"eslint:recommended",
"airbnb",
"airbnb/hooks",
"plugin:react/recommended",
"plugin:import/errors",
"plugin:import/warnings",
"plugin:jsx-a11y/recommended",
"prettier"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": 11,
"sourceType": "module"
},
"settings": {
"react": {
"version": "detect"
}
},
"plugins": [
"react",
"react-hooks"
],
"rules": {
"react/react-in-jsx-scope": "off",
"react/jsx-filename-extension": [
1,
{
"extensions": [
".js",
".jsx"
]
}
],
"react/display-name": 1,
"react/jsx-props-no-spreading": "off",
"react/prop-types": "off",
"jsx-a11y/anchor-is-valid": "off"
}
}
我的 Node 版本是最新的 15.11(我在 MacOS 上,如果重要的話)。
問題是我正在導入:
import fs from 'fs/promises';
和 eslint 拋出
Unable to resolve path to module 'fs/promises'.
否則,腳本可以工作,但我不明白是什么觸發了錯誤。
有人可以幫忙嗎?
yarn add -D eslint babel-eslint eslint-config-airbnb eslint eslint-plugin-jsx-a11y eslint-plugin-import eslint-plugin-react eslint-plugin-react-hooks eslint-config-prettier eslint-plugin-prettier
.eslintrc
文件:(如我的問題正文中所述)
file-example.js
:
import path from 'path';
import fs from 'fs/promises'; // <= this throws "Unable to resolve path to module 'fs/promises'.
function HomePage(props) {
const { products } = props;
return (
<ul>
{products.map((product) => (
<li key={product.id}>{product.title}</li>
))}
</ul>
);
}
export async function getStaticProps() {
const filePath = path.join(process.cwd(), 'data', 'dummy-backend.json');
const jsonData = await fs.readFile(filePath);
const data = JSON.parse(jsonData);
return {
props: {
products: data.products,
},
};
}
export default HomePage;
雖然我沒有使用反應,但純 typescript,我遇到了同樣的問題。 我通過像下面的示例一樣使用eslint-import-resolver-typescript進行配置來解決它。
settings: {
'import/resolver': {
typescript: {
alwaysTryTypes: true
},
},
}
alwaysTryTypes: true
使它工作,因為它讓 eslint 尊重node_modules/@types/*
,其中包括@types/node
,其中包含"fs/promises"
聲明(如果是最新版本)。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.