0
私はリアクションアプリを持っており、このアプリのテンプレートを使用しています。私server/index.htmlなどのcss、jsファイルやIMGなど、多くの静的ファイルがあるではリアクションの静的ファイル（css、js、img）を処理します
|app
|-client
|---assets
|---component
|-node_modules
|-server
|---index.html
|---index.js
：これは私のアプリのフォルダ構造を反応させています。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="/assets/img/logo-fav.png">
<title>Loyalty Multipolar</title>
<link rel="stylesheet" type="text/css" href="/assets/lib/perfect-scrollbar/css/perfect-scrollbar.min.css"/>
<link rel="stylesheet" type="text/css" href="/assets/lib/material-design-icons/css/material-design-iconic-font.min.css"/>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" href="/assets/css/style.css" type="text/css"/>
</head>
<body>
<div class="be-wrapper" id="root">
</div>
<script src="bundle.js"></script>
<script src="assets/lib/jquery/jquery.min.js" type="text/javascript"></script>
<script src="assets/lib/perfect-scrollbar/js/perfect-scrollbar.jquery.min.js" type="text/javascript"></script>
<script src="assets/lib/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
<script src="assets/js/main.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
Plugins.init();
});
</script>
</body>
</html>
Reactアプリケーションでこれらのファイルを処理するにはどうすればよいですか？一方、我々は静的ファイルを処理するためにこれを使用するノードJSアプリに：
app.use('/assets',express.static(__dirname + '/assets'));
静的なファイルがロードされていないと私は例えば入力した場合に検出されない： localhost:3000/assets/js/jquery、ファイルが
利用できず、この私のserver/index.jsファイル：
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';
let app = express();
const compiler = webpack(webpackConfig);
app.use(webpackMiddleware(compiler, {
hot: true,
publicPath: webpackConfig.output.publicPath,
noInfo: true,
}));
app.use(webpackHotMiddleware(compiler));
app.use('/assets',express.static(__dirname + '/assets'));
app.get('/*', (req, res) => {
res.sendFile(path.join(__dirname,'../index.html'));
})
app.listen(3000,() => console.log('Running port 3000'));
ありがとうございました。
ここで何が処理される必要がありますか？ – Scimonster
この例では、静的ファイルはロードされず、タイプ：localhost：3000/assets/js/jqueryと入力するとファイルが見つかりません。 – Mamen
これはReactではなくサーバー設定です。 – Scimonster