add watch

4 files changed, 156 insertions, 27 deletions

diff --git a/src/app/app.json b/src/app/app.json
index 0967ef4..f9ca764 100644
--- a/src/app/app.json
+++ b/src/app/app.json
@@ -1 +1,13 @@
-{}
+{
+  "pages":[
+    "pages/index/index"
+  ],
+  "window":{
+    "backgroundTextStyle":"light",
+    "navigationBarBackgroundColor": "#000",
+    "backgroundColor": "#fff",
+    "backgroundColorTop": "#000",
+    "navigationBarTitleText": "Gleam",
+    "navigationBarTextStyle":"white"
+  }
+}
diff --git a/src/app/pages/index/index.json b/src/app/pages/index/index.json
index 0967ef4..d6e25c7 100644
--- a/src/app/pages/index/index.json
+++ b/src/app/pages/index/index.json
@@ -1 +1,6 @@
-{}
+{
+  "usingComponents": {
+    "basic": "/components/basic/index"
+  }
+}
+
diff --git a/src/build.gleam b/src/build.gleam
index e85f13a..1de9015 100644
--- a/src/build.gleam
+++ b/src/build.gleam
@@ -3,6 +3,7 @@ import gleam/list
 import gleam/string
 import gleam/result
 import gleam/javascript/promise.{type Promise}
+import envoy
 import bundle
 
 @external(javascript, "./build_ffi.mjs", "bundle_build")
@@ -17,6 +18,18 @@ pub fn copy_build(json f: String, outfile o: String) -> Promise(Result(Nil, Stri
 @external(javascript, "./build_ffi.mjs", "less_build")
 pub fn less_build(less f: String, outfile o: String) -> Promise(Result(Nil, String))
 
+@external(javascript, "./build_ffi.mjs", "bundle_watch")
+pub fn bundle_watch(entry f: String, outfile o: String) -> Promise(Result(Nil, String))
+
+@external(javascript, "./build_ffi.mjs", "js_watch")
+pub fn js_watch(content c: String, outfile o: String) -> Promise(Result(Nil, String))
+
+@external(javascript, "./build_ffi.mjs", "copy_watch")
+pub fn copy_watch(json f: String, outfile o: String) -> Promise(Result(Nil, String))
+
+@external(javascript, "./build_ffi.mjs", "less_watch")
+pub fn less_watch(less f: String, outfile o: String) -> Promise(Result(Nil, String))
+
 const entry = "./build/dev/javascript/wechat_dev_tools/bundle.mjs"
 const app_content = "import { app } from './bundle.mjs'; app()"
 const dist = "./dist/"
@@ -52,40 +65,60 @@ fn component_content(p: String) -> String {
   ])
 }
 
-fn bundle_asset() -> List(Asset) {
-  [ Asset(entry, dist <> "bundle.mjs", bundle_build) ]
+fn bundle_asset(watch: Bool) -> List(Asset) {
+  case watch {
+    True -> [ Asset(entry, dist <> "bundle.mjs", bundle_watch) ]
+    False -> [ Asset(entry, dist <> "bundle.mjs", bundle_build) ]
+  }
 }
 
-fn app_assets() -> List(Asset) {
-  [ Asset(app_content, dist <> "app.js", js_build),
-    Asset(src <> "app.json", dist <> "app.json", copy_build),
-    Asset(src <> "app.less", dist <> "app.wxss", less_build) ]
+fn app_assets(watch: Bool) -> List(Asset) {
+  case watch {
+    True  -> [ Asset(app_content, dist <> "app.js", js_watch),
+               Asset(src <> "app.json", dist <> "app.json", copy_watch),
+               Asset(src <> "app.less", dist <> "app.wxss", less_watch) ]
+    False -> [ Asset(app_content, dist <> "app.js", js_build),
+               Asset(src <> "app.json", dist <> "app.json", copy_build),
+               Asset(src <> "app.less", dist <> "app.wxss", less_build) ]
+  }
 }
 
-fn page_assets(p: String) -> List(Asset) {
-  [ Asset(page_content(p), file_path(dist <> "/pages/", p, "js"), js_build),
-    Asset(file_path(src <> "/pages/", p, "json"), file_path(dist <> "/pages/", p, "json"), copy_build),
-    Asset(file_path(src <> "/pages/", p, "wxml"), file_path(dist <> "/pages/", p, "wxml"), copy_build),
-    Asset(file_path(src <> "/pages/", p, "less"), file_path(dist <> "/pages/", p, "wxss"), less_build) ]
+fn page_assets(p: String, watch: Bool) -> List(Asset) {
+  case watch {
+    True  -> [ Asset(page_content(p), file_path(dist <> "/pages/", p, "js"), js_watch),
+               Asset(file_path(src <> "pages/", p, "json"), file_path(dist <> "/pages/", p, "json"), copy_watch),
+               Asset(file_path(src <> "pages/", p, "wxml"), file_path(dist <> "/pages/", p, "wxml"), copy_watch),
+               Asset(file_path(src <> "pages/", p, "less"), file_path(dist <> "/pages/", p, "wxss"), less_watch) ]
+    False -> [ Asset(page_content(p), file_path(dist <> "/pages/", p, "js"), js_build),
+               Asset(file_path(src <> "pages/", p, "json"), file_path(dist <> "/pages/", p, "json"), copy_build),
+               Asset(file_path(src <> "pages/", p, "wxml"), file_path(dist <> "/pages/", p, "wxml"), copy_build),
+               Asset(file_path(src <> "pages/", p, "less"), file_path(dist <> "/pages/", p, "wxss"), less_build) ]
+  }
 }
 
-fn pages_assets() -> List(Asset) {
+fn pages_assets(watch: Bool) -> List(Asset) {
   bundle.pages()
   |> list.map(fn(p) { p.0 })
-  |> list.flat_map(fn(p) { page_assets(p) })
+  |> list.flat_map(fn(p) { page_assets(p, watch) })
 }
 
-fn component_assets(p: String) -> List(Asset) {
-  [ Asset(component_content(p), index_path(dist <> "/components/", p, "js"), js_build),
-    Asset(file_path(src <> "/components/", p, "json"), index_path(dist <> "/components/", p, "json"), copy_build),
-    Asset(file_path(src <> "/components/", p, "wxml"), index_path(dist <> "/components/", p, "wxml"), copy_build),
-    Asset(file_path(src <> "/components/", p, "less"), index_path(dist <> "/components/", p, "wxss"), less_build) ]
+fn component_assets(p: String, watch: Bool) -> List(Asset) {
+  case watch {
+    True  -> [ Asset(component_content(p), index_path(dist <> "/components/", p, "js"), js_watch),
+               Asset(file_path(src <> "components/", p, "json"), index_path(dist <> "/components/", p, "json"), copy_watch),
+               Asset(file_path(src <> "components/", p, "wxml"), index_path(dist <> "/components/", p, "wxml"), copy_watch),
+               Asset(file_path(src <> "components/", p, "less"), index_path(dist <> "/components/", p, "wxss"), less_watch) ]
+    False -> [ Asset(component_content(p), index_path(dist <> "/components/", p, "js"), js_build),
+               Asset(file_path(src <> "components/", p, "json"), index_path(dist <> "/components/", p, "json"), copy_build),
+               Asset(file_path(src <> "components/", p, "wxml"), index_path(dist <> "/components/", p, "wxml"), copy_build),
+               Asset(file_path(src <> "components/", p, "less"), index_path(dist <> "/components/", p, "wxss"), less_build) ]
+  }
 }
 
-fn components_assets() -> List(Asset) {
+fn components_assets(watch: Bool) -> List(Asset) {
   bundle.components()
   |> list.map(fn(p) { p.0 })
-  |> list.flat_map(fn(p) { component_assets(p) })
+  |> list.flat_map(fn(p) { component_assets(p, watch) })
 }
 
 fn fold_result(r0: Result(Nil, String), r: Result(Nil, String)) -> Result(Nil, String) {
@@ -108,10 +141,13 @@ fn build(ass: List(Asset)) -> Promise(Result(Nil, String)) {
 }
 
 pub fn main() {
-  use r0 <- promise.await(build(bundle_asset()))
-  use r1 <- promise.await(build(app_assets()))
-  use r2 <- promise.await(build(pages_assets()))
-  use r3 <- promise.await(build(components_assets()))
+  let watch = envoy.get("WECHAT_BUILD_WATCH")
+              |> result.is_ok
+              
+  use r0 <- promise.await(build(bundle_asset(watch)))
+  use r1 <- promise.await(build(app_assets(watch)))
+  use r2 <- promise.await(build(pages_assets(watch)))
+  use r3 <- promise.await(build(components_assets(watch)))
 
   [r0, r1, r2, r3]
   |> list.fold(Ok(Nil), fold_result)
diff --git a/src/build_ffi.mjs b/src/build_ffi.mjs
index eff03bf..df15223 100644
--- a/src/build_ffi.mjs
+++ b/src/build_ffi.mjs
@@ -1,4 +1,4 @@
-import { build } from 'esbuild'
+import { build, context } from 'esbuild'
 import { Ok, Error } from "./gleam.mjs"
 import { lessLoader } from 'esbuild-plugin-less';
 
@@ -65,3 +65,79 @@ export function less_build(css, out) {
       })
   })
 }
+
+export function bundle_watch(entry, out) {
+  return new Promise(resolve => {
+      context({
+        entryPoints: [entry],
+        bundle: true,
+        minify: true,
+        format: 'esm',
+        outfile: out,
+      }).then(function(ctx){
+        ctx.watch()
+        console.log("watching bundle...")
+      }).then(function(){
+        resolve(new Ok(undefined))
+      }).catch(function(e){
+        resolve(new Error(JSON.stringify(e)))
+      })
+  })
+}
+
+export function js_watch(js, out) {
+  return new Promise(resolve => {
+      context({
+        stdin: {
+          contents: js,
+          loader: 'js',
+        },
+        bundle: false,
+        minify: false,
+        format: 'esm',
+        outfile: out,
+      }).then(function(ctx){
+        ctx.watch()
+        console.log("watching js...")
+      }).then(function(){
+        resolve(new Ok(undefined))
+      }).catch(function(e){
+        resolve(new Error(JSON.stringify(e)))
+      })
+  })
+}
+
+export function copy_watch(src, out) {
+  return new Promise(resolve => {
+      context({
+        entryPoints: [src],
+        loader: {'.wxml': 'copy', '.json': 'copy'},
+        outfile: out,
+      }).then(function(ctx){
+        ctx.watch()
+        console.log(`watching json/wxml ${src}...`)
+      }).then(function(){
+        resolve(new Ok(undefined))
+      }).catch(function(e){
+        resolve(new Error(JSON.stringify(e)))
+      })
+  })
+}
+
+export function less_watch(css, out) {
+  return new Promise(resolve => {
+      context({
+        entryPoints: [css],
+        plugins: [lessLoader()],
+        loader: {'.less': 'css'},
+        outfile: out,
+      }).then(function(ctx){
+        ctx.watch()
+        console.log(`watching css ${css}...`)
+      }).then(function(){
+        resolve(new Ok(undefined))
+      }).catch(function(e){
+        resolve(new Error(JSON.stringify(e)))
+      })
+  })
+}