2017-10-24 15 views
0

node.jsサーバーを設定しようとしています。現在、現在のwebpack.config.jsでnpm startを実行すると、すべてがロードされます。ノードサーバーを実行すると、index.jsが見つかりません。webpackとnode.jsの出力ファイルがありません

webpack.config.js 
    var config = { 
    context: path.join(__dirname, 'src'), 
    entry: './js/main.js', 
    output: { 
     path: __dirname + '/src/', 
     filename: 'index.js', 
    }, 
    devServer: { 
     inline: true, 
     port: 8080 
    }, 
    module: { 
     loaders: [ 
     { 
      test: /\.jsx?$/, 
      exclude: /node_modules/, 
      loader: 'babel-loader', 
      query: { 
       presets: ['es2015', 'react'] 
      } 
     } 
     ] 
    } 
} 

module.exports = config; 

ここにはhtmlがあります。見た目は必要ありません。

<html lang="en"> 

    <head> 
    </head> 

    <body> 
    <div id="app"></div> 
    <script src="index.js"></script> 
    </body> 

</html> 

Package.json

{ 
    "name": "", 
    "version": "1.0.0", 
    "description": "", 
    "main": "webpack.config.js", 
    "scripts": { 
    "start": "webpack-dev-server --content-base src --hot", 
    "test": "echo \"Error: no test specified\" && exit 1" 
    }, 
    "author": "", 
    "license": "ISC", 
    "dependencies": { 
    "history": "^1.17.0", 
    "react": "^16.0.0", 
    "react-dom": "^16.0.0", 
    "react-router": "^4.2.0", 
    "webpack": "^3.8.1", 
    "webpack-dev-server": "^2.9.3" 
    }, 
    "devDependencies": { 
    "express": "^4.16.2", 
    "http": "0.0.0", 
    "react-socket-io": "^0.2.4", 
    "socket.io": "^2.0.3", 
    "webpack": "^3.8.1" 
    } 
} 

私はNode.jsのにかなり新たなんだとWebPACKの私はindex.jsは私がNPM開始を実行したときに出力されなくなったときにされている理由を正確にわからないんだけど私はノードサーバーを実行します。私はserver.jsをアップロードすることができますが、それは非常に基本的なテンプレートに従います。

編集:私はそれが働いているようだ、私は別のポート上のnode.jsサーバーだけでなくwebpack devのサーバーを実行する必要があります。問題をフォローアップしてください。これを変更してノードサーバーを実行しても問題はありませんか?

+0

を開始する前に、何のファイルがディスクに書き込まれません。それはすべてメモリから提供されます –

+0

あなたは確かにすることができます。 Checkout https://github.com/webpack/webpack-dev-middleware – jakewies

答えて

0

webpack --config path/to/webpack.config.jsを実行して、ノードサーバーを起動する前にファイルシステムにindex.jsを生成する必要があります。

あなたのpackage.jsonbuildコマンドを追加することができます。その後、

{ 
    ... 
    "scripts": { 
    "start": "webpack-dev-server --content-base src --hot", 
    "build": "webpack --config webpack.config.js", 
    "test": "echo \"Error: no test specified\" && exit 1" 
    }, 
    "author": "", 
    ... 
} 

とのDEVのサーバーを使用する場合はノードサーバの実行npm run build

+0

ありがとうございました。 webpack.config.jsからdevServerを削除しなければならなかったのですが、これはnode.jsを使用しているので適切ですか? – Chris

+0

私の喜び:)あなたはおそらくあなたの開発(npm開始)を維持するためにdevServerオブジェクトが必要です。私はwebpack-dev-serverを使用していないので、実際はわかりません。 devServerを削除しないとビルドが中断しますか? –

+0

ノードサーバーを使用しているときにwebpack-dev-serverは必要ありません。しかし、クライアントjsファイルで行う変更は、ビルドが古いほど反映されません。 npmの実行ビルドを使用して再構築し、nodejsサーバーを再実行する必要があります。この些細なことに代わるものがあります。救助するためのWebpack-dev-mideware。 @jakewiesコメントリンクを参照してください。 –

関連する問題