Skeleton Components

スケルトン

フロントエンド開発を開始します。スケルトンは、rosid上に構築されたHTML5ボイラープレートです。

コンテンツ

• 特徴
• 要件
• 設定
• 使い方
  • 開発する
  • コンパイル
  • ui
• Docker
• トラブルシューティング

特徴

• Skeletonは、毎日のWebプロジェクトのすべてのベースです。仕事を開始し、ゼロから始めることなく開発します。あなたが必要とするすべてが1つ離れています。
• このプロジェクトは、ジャストインタイムの前処理を備えたWebサーバーであるRosidを搭載しています。 JS（Babel、Uglifyjs）、SASS（CSSNANO、Autoprefixerを使用）、Nunjucksはすぐに使用できます。
• スケルトンはほんの始まりに過ぎません。それをフォークして、あなた自身のニーズに拡張します。事前に定義された構造により、柔軟性が得られ、簡単に変更できます。

要件

スケルトン依存者…

• node.js（v8.5.0以降）
• 糸

フォークとセットアップスケルトンの前に、必ずすべての依存関係をインストールして更新してください。

設定

開発を開始する前に、必要なすべての依存関係を糸でインストールします。

yarn install

使い方

開発する

次のコマンドの使用を開始します。ブラウザが開き、ファイルを更新するとすぐにコードチャンジを待ち、ライブレロードを即座に待ちます。 JS、SASS、NUNJUCKSは、フライでコンパイルされます。

yarn start

コンパイル

プライムタイムの準備はできましたか？視聴者向けにコンパイルされ、準備されたすべてのファイルをエクスポートします。最終的なdist/フォルダーをサーバーに簡単にアップロードしてリラックスします。席に着き、お気に入りのレストランからおいしいハンバーガーをお楽しみください。

yarn run compile

ui

スケルトンには、Webコンポーネントの構築と文書化を支援するMalvidが含まれています。開発サーバーを起動し、ブラウザで/index.htmlを開きます。 UIへのパスは、 rosidfile.jsで変更できます。

Docker

付属のDockerFileを使用すると、サイトをコンパイルする画像を作成できます。この場合、システムにDockerのみをインストールする必要があります。他の依存関係は必要ありません。

建てる

Dockerfileから画像を作成します。これは、プロジェクトを変更するたびに行う必要があります。新しいソースが画像にコピーされます。

docker build -t electerious/skeleton .

コンパイル

コンテナを起動してサイトをコンパイルします。すべてのタスクが終了したときに、コンテナは自動的に終了します。マウントされたボリュームには、すべてのコンパイルされたファイルが含まれます。

docker run --rm -tv " $( pwd ) /dist:/dist " electerious/skeleton

トラブルシューティング

• node.jsとYarnの最新バージョンをインストールします
• node_modulesを削除し、すべての依存関係を再インストールします
• プロジェクトがRosidの最新バージョンに依存しているかどうかを確認します
• 付属のDockerFileを使用してサイトをコンパイルしてみてください