iT邦幫忙

2022 iThome 鐵人賽

DAY 5
0

大家好,現在距離截稿只剩 45 分鐘,由於時間關係,今天看來也要水一下(筆者:三十天中水了五天真的好嗎 @.@)。

昨天我們試用了一下 purescript-halogen-template。如果有留意 terminal 的話會發現一些 compiler warnings:

Warning 1 of 19:

  in module Control.MonadZero
  at .spago/control/v5.0.0/src/Control/MonadZero.purs:48:1 - 48:43 (line 48, column 1 - line 48, column 43)

    A custom warning occurred while solving type class constraints:

      'MonadZero' is deprecated, use 'Monad' and 'Alternative' constraints instead


  in value declaration monadZeroArray

  See https://github.com/purescript/documentation/blob/master/errors/UserDefinedWarning.md for more information,
  or to contribute content related to this warning.
# 下略

這是因為 purescript-halogen-template 的 purescript 版本太舊了。考慮到今天的時間限制,我們可以來更新一下這個。首先打開 packages.dhall,按照以下的 diff 修改:

@@ -1,4 +1,4 @@
 let upstream =
-      https://github.com/purescript/package-sets/releases/download/psc-0.14.4-20211005/packages.dhall sha256:2ec351f17be14b3f6421fbba36f4f01d1681e5c7f46e0c981465c4cf222de5be
+      https://github.com/purescript/package-sets/releases/download/psc-0.15.4-20220901/packages.dhall sha256:f1531b29c21ac437ffe5666c1b6cc76f0a9c29d3c9d107ff047aa2567744994f
 
 in  upstream

修改 spago.dhall:

@@ -1,5 +1,5 @@
 { name = "halogen-project"
-, dependencies = [ "console", "effect", "halogen", "psci-support" ]
+, dependencies = [ "console", "effect", "halogen", "prelude" ]
 , packages = ./packages.dhall
 , sources = [ "src/**/*.purs", "test/**/*.purs" ]
 }

到這裡可以先跑 spago build

接下來修改 package.json:

@@ -1,9 +1,9 @@
 {
   "private": true,
   "devDependencies": {
-    "parcel": "1.12.3",
-    "purescript": "^0.14.0",
-    "spago": "^0.19.1"
+    "parcel": "2.7.0",
+    "purescript": "^0.15.4",
+    "spago": "^0.20.9"
   },
   "scripts": {
     "build": "spago build",

注意我們順道把 parcel 改成 v2,這樣應該會 build 更快。接下來跑一下 yarn

都好了以後我們照舊跑 yarn run build --watchyarn run serve

> yarn run serve
yarn run v1.22.15
$ parcel dev/index.html --open
Server running at http://localhost:1234
? Build failed.

@parcel/transformer-js: Browser scripts cannot have imports or exports.

  /Users/limouren/halogen-project/dev/index.js:1:1
  > 1 | require("../output/Main/index.js").main();
  >   | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 | 
  
  /Users/limouren/halogen-project/dev/index.html:8:5
     7 |   <body>
  >  8 |     <script src="./index.js"></script>
  >    |     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ The environment was originally created here
     9 |   </body>
    10 | </html>

  ? Add the type="module" attribute to the <script> tag.
  ? Learn more: https://parceljs.org/languages/javascript/#classic-scripts

yarn run serve 失敗了,因為 parcel v2 改用了 ES Module。按照指示修改 dev/index.html:

@@ -5,6 +5,6 @@
     <title>Halogen6 Template</title>
   </head>
   <body>
-    <script src="./index.js"></script>
+    <script src="./index.js" type="module"></script>
   </body>
 </html>

可以看到 parcel rebuild 成功:

Server running at http://localhost:1234
✨ Built in 485ms

到這裡去 http://localhost:1234 看看東西是不是都能動。這樣東西都能動也沒有 warnings,內心舒服多了!

Reference:

  1. https://github.com/purescript-halogen/purescript-halogen-template/pull/38
    • 實際改動為 cross-reference 之前產的 purescript template

上一篇
[Day 4] 該寫點 SPA 了
下一篇
[Day 6] 開始準備學習 purescript-halogen (~= 尚未開始學習)
系列文
從零開始的 Purescript8
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言