https://www.tutorialspoint.com/reactjs/reactjs_jsx.htmから基本的なReact Appを作成しました。Apacheベースのサーバーでこのテストコードを実行したいのですが、配布可能なビルドを作成する必要がありますが、それをする方法を見つけ出すことができ、明確な指示を見つけることができませんでした。Apache WebサーバーにReact Appをデプロイする方法
私はこの記事React,js on Apache serverを見てきましたが、それはいくつかのガイドライン
1は、いくつかの明確な指針や指示に導くことができれば、私は感謝するでしょう以上のものを持っていません。 P.P.私はPHPの開発者であるApacheの作品を知っています
をApacheサーバ用https://httpd.apache.org/docs/trunk/getting-started.htmlを、ここであなたのjavascriptのバンドルを作るために、私はちょうどそれが私のような誰かを助けることを願っています。 ウェブパックの設定ファイルは、 のようになります。指定されたdistディレクトリと出力ファイルを確認します。私は
const webpack = require('webpack');
const path = require('path');
var config = {
entry: './main.js',
output: {
path:path.join(__dirname, '/dist'),
filename: 'index.js',
},
devServer: {
inline: true,
port: 8080
},
resolveLoader: {
modules: [path.join(__dirname, 'node_modules')]
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015', 'react']
}
}
]
},
}
module.exports = config;
をdistディレクトリのパスを指定する方法がありませんでしたそして、パッケージJSONファイル
{
"name": "reactapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "webpack --progress",
"production": "webpack -p --progress"
},
"author": "",
"license": "ISC",
"dependencies": {
"react": "^15.4.2",
"react-dom": "^15.4.2",
"webpack": "^2.2.1"
},
"devDependencies": {
"babel-core": "^6.0.20",
"babel-loader": "^6.0.1",
"babel-preset-es2015": "^6.0.15",
"babel-preset-react": "^6.0.15",
"babel-preset-stage-0": "^6.0.15",
"express": "^4.13.3",
"webpack": "^1.9.6",
"webpack-devserver": "0.0.6"
}
}
お知らせスクリプトセクションおよび生成部、生産セクションでは、最終的に展開可能な指標を与えるものです。 jsが物事FOT
残りはcommanの次のシーケンスを実行し、あなたのコードやコンポーネント
に依存します（名前は何でもかまいません）ファイルDS
NPMその後、
（ノードモジュール）これはあなたにすべての依存関係を取得する必要があります
をインストール
NPMの実行生産
これはあなたを取得する必要があります含まれる最後のindex.jsファイルすべてのコードはバンドルされています
www.htmlまたはwebappのルートディレクトリとthats allの下にindex.htmlとindex.jsファイルを置いたら完了です。
Reactはブラウザベースの技術です。これは、HTML文書内のビューのみをレンダリングします。
あなたの「アプリケーションに反応」へのアクセス権を持つことができるように、あなたがする必要があります。
あなたはここにすべての情報を持っているかもしれません。最終的にそれを把握することができたhttps://www.codementor.io/tamizhvendan/beginner-guide-setup-reactjs-environment-npm-babel-6-webpack-du107r9zr
Apacheプロキシ経由で実行できますが、仮想ディレクトリ（例：http://mysite.something/myreactapp）で実行する必要があります。
これは冗長に見えるかもしれませんが、Reactアプリケーション（PHPページなど）に含まれていない他のページがある場合は、ポート80経由ですべてを提供し、すべてが結束したウェブサイトであることを確認できます。
1.）npmを実行するか、ノードサーバーの起動に使用しているコマンドを使用して、反応アプリを起動します。それはhttp://127.0.0.1:8080
2）上で実行されているとすると、編集のhttpd-proxy.confおよび追加：
ProxyRequests On
ProxyVia On
<Proxy *>
Order deny,allow
Allow from all
</Proxy>
ProxyPass /myreactapp http://127.0.0.1:8080/
ProxyPassReverse /myreactapp http://127.0.0.1:8080/
3）
これは生産に関するもので、私はそのようなセットアップをしたくない –
まずApacheを再起動し、 packages.jsonフォルダに移動して、実際のドメインアドレスと一致するようにこのコード行を入力してください：
"homepage": "https://yourwebsite.com/afolder/",
第二には、プロジェクトフォルダとタイプで端末に行く：
npm run build
今はプロジェクトのフォルダ構造にビルドフォルダがあることがわかります。
あなただけがあなたのサーバーにfilezillaを使ってアップロードします。
私はApacheの仕事をする方法を知っています。私はPHPの開発者です。私の問題は、ソースから配布可能なものをビルドしてからリダイレクト用のApacheをセットアップすることです。 –
モジュールバンドラ（webpackなど）を使用して、javascriptライブラリを作成する必要があります。 https://www.codementor.io/tamizhvendan/beginner-guide-setup-reactjs-environment-npm-babel-6-webpack-du107r9zr。あなたのニーズに合わせて私の答えを編集しました。 –