Devsway

日々の記録とか記憶とか。

## まずはparcelコマンドをグローバルにインストール


npm install -g parcel-bundler
mkdir parcel && cd parcel

そこで、、


npm init -y

-yは -yesのことです!



次に表示側(html + js)を作ります


<html>
<body>
hello parcel
<script src="./index.js"></script>
</body>
</html>
console.log('hello world')

そして、、これでサーバーを立ち上げします


parcel index.html

http://localhost:1234/

を開きます!

きたー!!


表示が確認できました!


何ができたの??



  • バンドルビルド

    ひとつのjsファイルなのでわかりづらいですが、

    es6記法で書いたものがトランスコンパイルされ、さらにimport溶かしていた場合、依存性の解決をして、

    ひつとのファイルになっているはずです。




  • ローカルサーバーの立ち上げ+ホットリロード




これですぐに開発環境が出来上がりました!すごい!!



本番用ビルドについて


parcel build entry.js

これだけ!です、簡単!!


本場用ビルドの特徴について



  • サーバーは立ち上がりません

  • 環境変数のセットでも実行できます NODE_ENV=production

  • ミニファイされます


ミニファイの種類


terser ・・・ JavaScript

cssnano ・・・ CSS

htmlnano ・・・ HTML


参考


https://parceljs.org/getting_started.html




カテゴリー

オレオレIT用語辞典