random quote machine

Nano React AppデフォルトのJavaScriptテンプレート

Nano-React-Appのデフォルトのテンプレートプロジェクト。

• npm start - これにより、デフォルトのポートが1234の開発サーバーが生成されます。
• npm run build - これにより、 distディレクトリに生産ビルドが出力されます。

カスタムポート

-pフラグを使用して、開発用のポートを指定できます。これを行うには、追加のフラグからnpm startを実行することができます。

 npm start -- -p 3000

または、 startスクリプトを直接編集します。

 parcel index.html -p 3000

スタイルの追加

JavaScriptのどこでも、簡単なES2015 importステートメントを使用してCSSファイルを使用できます。

 import "./index.css" ; 

バベルは変身します

Babel Preset Babel-Preset-Nano-React-Appは、React Appサポートを作成するのと同じ変換をサポートするために使用されます。

Babel構成はpackage.json内に存在し、外部.babelrcファイルをオーバーライドするため、 .babelrcを使用する場合は、 package.json内のbabelプロパティを削除することを忘れないでください。

githubページに展開します

GitHubページを使用してプロジェクトを展開することもできます。最初にgh-pagesパッケージをインストールします。

npm i -D gh-pages

Parcelの--public-urlフラグを使用すると、展開には次のスクリプトを使用します。

 "scripts": {
  "start": "parcel index.html",
  "build": "parcel build index.html --public-url '.'",
  "predeploy": "rm -rf dist && parcel build index.html --public-url '.'",
  "deploy": "gh-pages -d dist"
},

次に、GitHubページの通常の手順に従って、 gh-pagesブランチを選択します。