Tepki öğrenmeyi deniyorum ve istemci tarafı yönlendirmeyi denerken bazı sorunlara geliyorum.tepki istemci tarafında oluşturma hatası alınamıyor/
: Eğer benim dosyalarında ben tarayıcı sayfasında almaya devam listed.The hata var hata
/
GET olamaz benim Konsolda görebileceğiniz hata olduğunu görürseniz lütfen bize bildirin live.bundle.js: 14 GET http://localhost:8080/ 404 (Bulunamadı)
İştebenim dosyalar şunlardır:
webpack.config.js
var webpack = require('webpack');
module.exports = {
entry: [
'webpack/hot/only-dev-server',
'./js/app.js'
],
output: {
path: __dirname + '/build',
filename: "bundle.js"
},
module: {
loaders: [
{ test: /\.js?$/, loaders: ['react-hot', 'babel', 'babel-loader'], exclude: /node_modules/ },
// { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' },
{ test: /\.css$/, loader: "style!css" }
]
},
devServer: {
contentBase: "./src/www",
noInfo: true,
hot: true,
inline: true
},
plugins: [
new webpack.NoErrorsPlugin()
]
};
.babelrc
{
"presets": ["es2015", "react"]
}
index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>New React App</title>
</head>
<body>
<section id="react"></section>
<script src="/build/bundle.js"></script>
</body>
</html>
/js/app.js
import React from 'react';
import Router from 'react-router';
import {DefaultRoute, Link, Route, RouteHandler} from 'react-router';
import LoginHandler from './components/Login.js';
class App extends React.Component{
render() {
return(
<div className="nav">
<Link to="app">Home</Link>
<Link to="login">Login</Link>
{/* Important Part */}
<RouteHandler/>
</div>
);
}
}
let routes = (
<Route name="app" path="/" handler={App}>
<Route name="login" path="/login" handler={LoginHandler}/>
</Route>
);
ReactDOM.run(routes, function (Handler) {
React.render(<Handler/>, document.body);
});
/js/components/Login.js
import React from 'react';
class Login extends React.Component{
render() {
return(
<div>Welcome to login</div>
);
}
}
export default Login;
Yardımı takdir ediyorum.
İşte
var webpack = require('webpack');
module.exports = {
entry: [
'webpack/hot/only-dev-server',
'./js/app.js',
'webpack-dev-server/client?localhost:8080'
],
output: {
path: __dirname + '/build',
filename: "bundle.js"
},
module: {
loaders: [
{ test: /\.js?$/, loaders: ['react-hot', 'babel', 'babel-loader'], exclude: /node_modules/ },
// { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' },
{ test: /\.css$/, loader: "style!css" }
]
},
devServer: {
// contentBase: "./src/www",
noInfo: true,
hot: true,
inline: true
},
plugins: [
new webpack.NoErrorsPlugin(),
new webpack.HotModuleReplacementPlugin()
]
};
Uygulamanızın 'bundle.js' çıktı dosyasını oluşturup oluşturmadığını kontrol ettiniz mi? Öyleyse o zaman sebebi budur. Bu sadece belirli bir dosyayı bulamıyor ve kodunuzdaki problem olan 'index.html' dosyasında içe aktardığınız için. Bu yüzden, 'bundle.js' dosyasının oluşturulduğundan emin olun. –
Merhaba Amir, benim app build adlı bir klasör içinde bundle.js dosyası yaratıyor. –