0
画面に出力が表示されませんが、エラーは発生していません。私は必要と考えられるものを投稿します。私は新しいプロジェクトを開始し、少し違ったことを試しているので、いくつかの助けが必要です。REACTを使用して画面に出力が表示されない
更新：ここで私はアプリを起動します。私は、ルートディレクトリからコンソールでnpm run serverを実行し、これはスクリプト"server": "nodemon --watch server --exec babel-node -- server/index.js"
webpack.configです：
import path from 'path';
import webpack from 'webpack';
export default {
devtool: 'eval-source-map',
entry: [
'webpack-hot-middleware/client',
path.join(__dirname, './client/index.js')
],
output: {
filename: 'bundle.js',
path: '/',
publicPath: '/'
},
plugins: [
new webpack.NoEmitOnErrorsPlugin(),
new webpack.HotModuleReplacementPlugin()
],
module: {
loaders: [
{
test: /\.js$/,
include: path.join(__dirname, 'client'),
loaders: [ 'react-hot-loader', 'babel-loader' ]
}
]
},
resolve: {
extensions: ['*', '.js']
}
}
index.js：
import React from 'react';
import { render } from 'react-dom';
import App from './components/App';
render(<App />, document.getElementById('app'));
はindex.htmlを：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta content="width=device-width, initial-scale=1" name="viewport" />
</head>
<body>
<div id="app"></div>
<scrip src="bundle.js" type="text/javascript"></scrip>
</body>
</html>
アプリ：
のimport React from 'react';
class App extends React.Component {
render() {
return (
<h1>!Hello from react!</h1>
)
}
}
export default App;
サーバーindex.js：代わりに<scrip src="bundle.js" type="text/javascript"></scrip>
<script>で
import express from 'express';
import path from 'path';
import webpack from 'webpack';
import webpackMiddleware from 'webpack-dev-middleware';
import webpackHotMiddleware from 'webpack-hot-middleware';
import webpackConfig from '../webpack.config.dev';
const app = express();
const compiler = webpack(webpackConfig);
app.use(webpackMiddleware(compiler));
app.use(webpackHotMiddleware(compiler, {
hot: true,
publicPath: webpackConfig.output.publicPath,
noInfo: true
}));
app.get('/*', (req, res) => {
res.sendFile(path.join(__dirname, './index.html'));
});
app.listen(3000,() => {
console.log('listening on port 3000');
});
は、コンソールには何も見ることができませんか？ – rakwaht
コンソールまたはターミナルには、localhost：3000では何も表示されません。サーバーindex.jsを追加して、役立つかどうか確認してみましょう。 –
mmmおそらくそれを起動する方法に問題があります。あなたがどのようにしたのかを説明してください – rakwaht