ホームページ  >  記事  >  ウェブフロントエンド  >  create-react-app とは何ですか? create-react-app は React 開発環境用のアプリケーションを構築します

create-react-app とは何ですか? create-react-app は React 開発環境用のアプリケーションを構築します

不言
不言オリジナル
2018-09-07 16:32:242776ブラウズ

create-react-app とは何ですか? create-react-app では何ができるのでしょうか?この記事では、create-react-app を使用して React 開発環境を構築する方法を紹介します。

1. create-react-app とは何ですか?
反応プロジェクトに取り組み、その開発環境を構築することは初心者にとって非常に難しいです。そこで Facebook は、React プロジェクトの開発環境を構築するための create-react-app コマンドを特別に開発しました。

create-react-appはwebpack+ES6をベースに作成されています。

2. 使用方法。
コマンドラインで以下のコマンドを順番に実行してプロジェクトの構築を完了します。

cnpm install -g create-react-appcreate-react-app my-app 
//这里的my-app是随便起的一个项目名称而已。
cd my-app/
npm start

最終的なプロジェクト ディレクトリは次のとおりです:
create-react-app とは何ですか? create-react-app は React 開発環境用のアプリケーションを構築します
レンダリングは次のようになります:
create-react-app とは何ですか? create-react-app は React 開発環境用のアプリケーションを構築します
3. プロジェクト ディレクトリの説明:
パブリック フォルダー: 内部のindex.html は、 React プロジェクト全体 ページのプロジェクト テンプレート。しかし、それはコードの記述とは何の関係もなく、最終的なページの表示に関係します。

src フォルダー: ここにコードを記述します。

src/index.js: プロジェクト全体のエントリーjsファイルです。
src/app.js: これは、index によって導入され、js ファイルによっても表されるコンポーネントです。
src/index.css:index.jsのスタイルファイル。
src/app.css: app.jsのスタイルファイルです。
logo.svg: svg画像ファイルです。インターフェースの表示に使用されます。

4. しかし、私は個人的にそのような構造に満足せず、開発には適していません。
以下は私が行った最初の変換です:
create-react-app とは何ですか? create-react-app は React 開発環境用のアプリケーションを構築します

ディレクトリを変更し、プロジェクトのパスを変更し、このディレクトリでプロジェクトの開発作業を続行します。

関連する推奨事項:

WeChat ミニ プログラムのチュートリアル ミニ プログラムの構成

WeChat ミニ プログラムと Alipay ミニ プログラムの比較と違いの紹介

以上がcreate-react-app とは何ですか? create-react-app は React 開発環境用のアプリケーションを構築しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。