@matoruru
Edited at

PureScriptプロジェクトをバンドルしてブラウザで表示するメモ

altjspurescriptparcel


手順メモ

タイトルがカタカナばっかりで嫌です。

ほぼ自分用の雑メモです。詳しいことは書いてません。でも超簡単です。

本記事では、yarnがグローバルインストールされていることを前提とします。

以下のコマンドを使います。

$ mkdir purs-js-test

$ cd purs-js-test

$ yarn init -y

$ yarn add -D purescript spago parcel-bundler

$ yarn run spago init

$ yarn run spago install

必須ではありませんが、PureScriptファイルで補完を使いたい場合は以下を実行すると良いです。一度ビルドした後から補完が有効になります。


※補完が必要な場合のみ

$ yarn add -D bower

$ yarn run bower init

$ yarn run bower install -D purescript-effect purescript-console purescript-prelude

次に、以下の2ファイルを用意します。


src/index.html

<html>

   <body>

      <script src="./index.js"></script>

   </body>

</html>


src/index.js

require("../output/Main").main();


src/Main.purs

module Main where



import Prelude

import Effect (Effect)

import Effect.Console (log)



main :: Effect Unit

main = do

  log "Hello world!"

以下のコマンドを使います。

$ yarn run spago build

$ yarn run parcel src/index.html -p 12345

ブラウザで以下のURLにアクセスします。

http://localhost:12345

F12を押して、コンソールに「Hello world!」と表示されていれば成功です。


依存パッケージのインストール方法

プロジェクトを配布するときには以下のファイル・ディレクトリを含めます。


  • package.json

  • packages.dhall

  • spago.dhall

  • yarn.lock

  • src/

  • test/

GitHubリポジトリなどのクローンで配布された側は、以下のコマンドを使うだけで依存パッケージをインストールできます。

$ yarn install

$ yarn run spago install

あとは前節に書いたビルド手順に従います。

Edit request
2