React と React Native のスレ (482ﾚｽ)
上下前次1-新
抽出解除 必死ﾁｪｯｶｰ(本家) (べ) 自ID ﾚｽ栞 あぼーん
ﾘﾛｰﾄﾞ規制です｡10分ほどで解除するので､他のﾌﾞﾗｳｻﾞへ避難してください｡
12(1): デフォルトの名無しさん [] 2019/03/23(土) 13:29:30.06 ID:Tnjwe5F0(1/3) AAS
JSXで書いたファイルを、
HTMLとJSに変換する方法があれば教えて頂けないでしょうか・・・。
14(2): デフォルトの名無しさん [sage] 2019/03/23(土) 16:47:46.96 ID:Tnjwe5F0(2/3) AAS
>>1313(1): デフォルトの名無しさん [sage] 2019/03/23(土) 16:40:55.66 ID:UK/ZLX81(1/3) AAS
>>12
前提知識が不明なのでとりあえず順番に
1. 「node.js インストール」でググる
2. 「npm react インストール」でググる
3. 「webpack react ビルド」でググる
概要としては node上で動くnpmコマンドで
React, webpack, Babelをインストールして、webpackでビルド
それとJSXはJavaScriptの構文拡張でしかないから
変換(ビルド)で出てくるのはJSだけ
失礼しました・・・。
node.jsはすでに入れてあり、reactはcreate-react-appからのを使っています。
webpackとbabelはreactを使う上でよく聞きました（ほとんど使えませんが・・・）
＞それとJSXはJavaScriptの構文拡張でしかないから
＞変換(ビルド)で出てくるのはJSだけ
というのは、>>13さんのwebpackでビルドしてもhtmlは出ない（jsファイルのみ出来る）という事でしょうか？
17(2): デフォルトの名無しさん [sage] 2019/03/23(土) 18:44:19.14 ID:Tnjwe5F0(3/3) AAS
>>1515(1): デフォルトの名無しさん [sage] 2019/03/23(土) 17:42:18.24 ID:SoDVK1qs(1/3) AAS
>>14
npm run build
でdistフォルダに生成されてない？
package.jsonにscriptsって項目で
npm run 〇〇
で使えるコマンド一覧が書いてあるから一度確認してみ
>>1616(1): デフォルトの名無しさん [sage] 2019/03/23(土) 17:42:53.33 ID:UK/ZLX81(2/3) AAS
>>14
create-react-appなら npm run build でビルド出来る (裏でwebpackやbabelが動く)
js(JSX)をビルドするだけならhtmlは出ない
create-react-appならhtmlの最適化コピーを出すようになってる
元ファイルは public/index.html にあるはず
ありがとうございます
そういうことだったのですね・・・
無事出力されました。
buildしたファイルにindex.htmlができました。
改行がされず最小の表示？(min.jsの様な）になっているのですが、
こちらをj従来の読みやすさ重視で表示できる様にする方法はありませんか…？
reactで作っている傍、知人にはhtmlとjsで同じ構成のを見せたくて、
reactで書いたのに別途htmlとjsで同じものを作るのも大変なので、そういった方法があればなと。
上下前次1-新書関写板覧索設栞歴
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.036s