Q&A
ご回答ありがとうございます！
承知しました。現状cliに原因がありそうなので、アップデートしてみます。
前提・実現したいこと
現在webpackによるビルドが動作しなくなってしまったため、そのエラーを直したいと考えています。
エラーが発生するまでは正常にビルドできていたため、何か変更してしまった可能性があります。
何か原因にお心当たりのある方がいましたら、ご教授いただければ幸いです。
実行環境
Windows 10
Ubuntu 18.04.5 LTS (Bionic Beaver)
発生している問題・エラーメッセージ
ビルドを行うと、以下のようなエラーが発生します。
vagrant@ubuntu-bionic:~/workspace/bbs$ yarn run build yarn run v1.21.1 $ webpack [webpack-cli] { [Error: EIO: i/o error, close] errno: -5, code: 'EIO', syscall: 'close' } error Command failed with exit code 2. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
ソースコード
簡略化のため、headerコンポーネントを表示するコードになっています。
- index.js
JavaScript
1import React from 'react'; 2import ReactDOM from 'react-dom'; 3import { 4 BrowserRouter as Router, 5 Switch, 6 Route, 7 Link 8 } from 'react-router-dom'; 9import { BBSApp } from './bbsApp'; 10import { Header } from './header'; 11 12const App = () => { 13 return ( 14 <> 15 <Header styles={styles} /> 16 </> 17 ); 18}; 19 20const styles = { 21 h1: { 22 backgroundColor: 'blue', 23 color: 'white', 24 fontSize: 24, 25 padding: 12 26 }, 27 form: { 28 padding: 12, 29 border: '1px solid silver', 30 backgroundColor: '#F0F0F0' 31 }, 32 right: { 33 textAlign: 'right' 34 } 35 }; 36 37ReactDOM.render( 38 <App />, 39 document.getElementById('root') 40);
- header.js
JavaScript
1import React from 'react'; 2import { 3 BrowserRouter as Router, 4 Switch, 5 Route, 6 Link 7 } from 'react-router-dom'; 8import ReactDOM from 'react-dom'; 9import { BBSApp } from './bbsApp'; 10 11export const Header = (props) => { 12 const {styles} = props; 13 return ( 14 <> 15 <h1 style={styles.h1}>掲示板</h1> 16 </> 17 ); 18};
- index.html
html
1<!DOCTYPE html> 2<html><head><meta charset="utf-8"></head><body> 3 <div id="root"></div> 4 <script src="bundle.js"></script> 5</body></html>
- package.json
{ "name": "bbs", "version": "1.0.0", "main": "index.js", "license": "MIT", "scripts": { "build": "webpack" }, "dependencies": { "@babel/core": "^7.12.10", "@babel/preset-env": "^7.12.11", "@babel/preset-react": "^7.12.10", "babel-loader": "^8.2.2", "express": "^4.17.1", "nedb": "^1.8.0", "react": "^17.0.1", "react-dom": "^17.0.1", "react-router-dom": "^5.2.0", "superagent": "^6.1.0", "webpack": "^5.11.1", "webpack-cli": "^4.2.0" } }
- webpack.config.js
JavaScript
1const path = require('path') 2module.exports = { 3 mode: "production", 4 entry: path.join(__dirname, 'src/index.js'), 5 output: { 6 path: path.join(__dirname, 'public'), 7 filename: 'bundle.js' 8 }, 9 10 module: { 11 rules: [ 12 { 13 test: /.js$/, 14 use: [ 15 { 16 loader: "babel-loader", 17 options: { 18 presets: [ 19 "@babel/preset-env", 20 "@babel/react" 21 ] 22 } 23 } 24 ] 25 } 26 ] 27 }, 28 target: ["web", "es5"], 29 };
問題発生までに行ったこと
エラーが起こった日には、react routerの導入のためyarn add react-router-domは行いました。ただ、これの動作確認はできており、直後にエラーが発生したわけではないです。
エラーが起きた時の状況は具体的には思い出せないのですが、Routerのswitchによるルーティングをindex.jsで調整していました。
試したこと
主に３つ試しました。
- 以前動いていたファイルに切り替える → 状況変わらず
- webpackの再インストール → 状況変わらず
- webpack-cliの再インストール → エラーによりできず
//webpack-cli再インストールのエラー内容 vagrant@ubuntu-bionic:~/workspace/bbs$ yarn add webpack-cli yarn add v1.21.1 [1/4] Resolving packages... [2/4] Fetching packages... error human-signals@2.1.0: The engine "node" is incompatible with this module. Expected version ">=10.17.0". Got "10.14.2" error Found incompatible module. info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
以上を考慮すると、コード自体に原因はないように個人的には考えております。
どなたか何卒よろしくお願いします。
追加で試したこと①：nodeのバージョン変更
error human-signals@2.1.0: The engine "node" is incompatible with this module. Expected version ">=10.17.0". Got "10.14.2"
このエラー文を参考にnodeのバージョンをv10.17.0に変更しましたが、同様のエラーが発生しました。
追加で試したこと②：routerのアンインストール
routerをアンインストールし、コードを改変せずにビルドしたところ、以下のようなエラーに変わりました。前半は普段ビルドしているときに出てくる文が出てきました。
これが原因かと思ったのですが、その後router部分を削除してビルドすると、元のエラーに戻りました。試しに他の文法エラーを入れてビルドしても以下のようにエラーが発生しました。
ここから分かることは、文法ミスが原因の可能性は低いということでしょうか。
vagrant@ubuntu-bionic:~/workspace/bbs$ yarn run build yarn run v1.21.1 $ webpack assets by status 161 KiB [cached] 1 asset orphan modules 12.4 KiB [orphan] 3 modules runtime modules 718 bytes 3 modules modules by path ./node_modules/ 277 KiB modules by path ./node_modules/superagent/ 72.7 KiB 11 modules modules by path ./node_modules/react/ 9.06 KiB 2 modules modules by path ./node_modules/react-dom/ 178 KiB ./node_modules/react-dom/index.js 1.32 KiB [built] [code generated] ./node_modules/react-dom/cjs/react-dom.production.min.js 176 KiB [built] [code generated] modules by path ./node_modules/scheduler/ 7.28 KiB ./node_modules/scheduler/index.js 197 bytes [built] [code generated] ./node_modules/scheduler/cjs/scheduler.production.min.js 7.09 KiB [built] [code generated] ./node_modules/object-assign/index.js 2.17 KiB [built] [code generated] ./node_modules/component-emitter/index.js 3.27 KiB [built] [code generated] ./node_modules/fast-safe-stringify/index.js 4.83 KiB [built] [code generated] ./src/index.js + 3 modules 13.9 KiB [built] [code generated] ERROR in ./src/bbsApp.js 24:0-80 Module not found: Error: Can't resolve 'react-router-dom' in '/home/vagrant/workspace/bbs/src' @ ./src/index.js 4:0-34 ERROR in ./src/header.js 2:0-80 Module not found: Error: Can't resolve 'react-router-dom' in '/home/vagrant/workspace/bbs/src' @ ./src/index.js 5:0-34 8:97-103 ERROR in ./src/index.js 3:0-80 Module not found: Error: Can't resolve 'react-router-dom' in '/home/vagrant/workspace/bbs/src' webpack 5.11.1 compiled with 3 errors in 9714 ms error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
回答2件
0
自己解決
環境を新しく構築したところ、ビルドすることできました。結局原因は分かりませんでした。
educ_gt様、ご回答いただきありがとうございました。
投稿2021/01/03 10:18
総合スコア36
0
The engine "node" is incompatible with this module. Expected version ">=10.17.0". Got "10.14.2" error Found incompatible module.
このエラーに従って、node.jsを新しいバージョンにしたらよさそうです。
何でnode.jsを導入したかによりますが、導入方法、node updateとかで調べたら出てくると思います。
そしたらwebpack-cliも最新版が入ってエラーが解決しそうな気がします。
投稿2021/01/03 05:53
総合スコア282
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。