ParcelJSをサービスで使って見る準備

この記事の目次
chevron_right プロジェクトの新規作成
chevron_right parcelJSを入れる
chevron_right package.jsonの編集
chevron_right 実行

yarnでやっていこうと思います。

プロジェクトの新規作成

 
> yarn init

parcelJSを入れる

 
> yarn add parcel-bundler --dev

package.jsonの編集

package.jsonに以下を追加する。

Laravel想定。あとindex.jsをコンパイルする想定。

  "scripts": {
    "dev": "parcel ./resources/js/index.js -d ./public/js/",
    "build": "parcel build ./resources/js/index.js -d ./public/js/"
  },

なお、上記スクリプトは実行するとparcelJSが準備している開発サーバが立ち上がるので、
それを行いたくない場合は以下のスクリプトを利用する。

  "scripts": {
    "dev": "parcel watch ./resources/js/index.js -d ./public/js/",
    "build": "parcel build ./resources/js/index.js -d ./public/js/"
  },

実行

 
yarn dev

これで、コンパイルされたindex.jsが/public/js/配下に出力されます。

[PR] おすすめの本
この記事を書いた人
Nな人（えぬなひと）。
Nは本名から取っています。
Laravelが大好きなPHPerで、WEBを作るときはLaravelを技術スタックに絶対推すマン。
PHP、Pythonと、昔はperlを書いていたP言語エンジニア。
最近はNimを書いたりしています。