webpackで「ファイル 'を解決できません」というエラーを解決するにはどうすればよいですか？

Question

私はwebpackでこれを実際に迷惑なエラーにしており、webpack --display-error-detailsを実行してもエラーは発生しません。しかし、いつでも私は実行するwebpack-dev-server私は次のエラーが表示されます。私は自分の設定でどこが間違っているのか分かりません。 WebPACKのは、あなたがそれをしたいと__dirname治療されず、/その代わりに、それを解決することができる

Entry module not found: Error: Cannot resolve 'file' or 'directory' 
./frontend/app.jsx 

---

module.exports = { 
    context: __dirname, 
    entry: './frontend/app.jsx', 
    output: { 
    filename: 'bundle.js', 
    path: __dirname 
    }, 
    module: { 
    loaders: [ 
     { 
     test: [ /\.js$/, /\.jsx$/], 
     exclude: /(node_modules)/, 
     loader: 'babel-loader', 
     query: { 
      presets: ['es2015', 'react'] 
     } 
     }, 
     { 
     test: /\.scss$/, 
     use: ['style-loader', 'css-loader', 'sass-loader'] 
     } 
    ] 
    }, 
    devtool: 'source-map', 
    resolve: { 
    extensions: ['.js', '.jsx', '.scss' ] 
    } 
}; 

---

{ 
    "name": "basicapp", 
    "version": "1.0.0", 
    "description": "", 
    "main": "app.jsx", 
    "author": "", 
    "license": "ISC", 
    "scripts": { 
    "start": "webpack-dev-server --env development", 
    "dev-server": "nodemon ./server.js localhost 8080", 
    "build": "webpack --env production" 
    }, 
    "dependencies": { 
    "babel-cli": "^6.24.0", 
    "babel-core": "^6.24.0", 
    "babel-loader": "^6.4.1", 
    "babel-preset-es2015": "^6.24.0", 
    "babel-preset-react": "^6.23.0", 
    "css-loader": "^0.27.3", 
    "express": "^4.15.2", 
    "express-graphql": "^0.6.3", 
    "lodash": "^4.17.4", 
    "node-sass": "^4.5.1", 
    "react": "^15.4.2", 
    "react-dom": "^15.4.2", 
    "react-redux": "^5.0.3", 
    "react-router": "^4.0.0", 
    "redux": "^3.6.0", 
    "sass-loader": "^6.0.3", 
    "webpack": "^2.3.2" 
    }, 
    "devDependencies": { 
    "html-webpack-plugin": "^2.28.0", 
    "node-sass": "^4.5.1", 
    "nodemon": "^1.11.0", 
    "sass-loader": "^6.0.3" 
    } 
} 

Answer 1

。あなたのWebPACKの設定にこれを追加してみてください：

{ 
    node: { 
    __dirname: true 
    } 
} 

Answer 2

これが原因で、正確な問題を特定するための最良の方法は、以下の二つのコマンドトライアウトすることで、複数の理由からのものとすることができる：あなたはWebPACKのを実行している場合

を1/2一人で、その後スニペットを使用します。

webpack --display-error-details 

あなたはWebPACKのdevのサーバーを実行している場合、スニペットを使用します。

webpack-dev-server --display-error-details 

これはコンソールに詳細なエラーレポートを表示します