[add] Page Builder typescript support

script/script.go

@@ -11,7 +11,7 @@ import (
 
 // Load 加载共享库
 func Load(cfg config.Config) error {
-	exts := []string{"*.js"}
+	exts := []string{"*.js", "*.ts"}
 	err := application.App.Walk("scripts", func(root, file string, isdir bool) error {
 		if isdir {
 			return nil

sui/core/block.go

@@ -3,21 +3,55 @@ package core
 import (
 	"fmt"
 	"strings"
+
+	"github.com/evanw/esbuild/pkg/api"
+	"github.com/yaoapp/gou/runtime/transform"
 )
 
 // Compile compile the block
 func (block *Block) Compile() (string, error) {
 
+	// Typescript is the default language
+	// Typescript
+	if block.Codes.TS.Code != "" {
+		varName := strings.Replace(block.ID, "-", "_", -1)
+		ts := strings.Replace(block.Codes.TS.Code, "export default", fmt.Sprintf("window.block__%s =", varName), 1)
+		if block.Codes.HTML.Code != "" && !strings.Contains(block.Codes.TS.Code, "content:") {
+			html := strings.ReplaceAll(block.Codes.HTML.Code, "`", "\\`")
+			ts = strings.Replace(ts, "{", fmt.Sprintf("{\n  content: `%s`,", html), 1)
+		}
+
+		js, err := transform.TypeScript(ts, api.TransformOptions{
+			Target:            api.ESNext,
+			MinifyWhitespace:  true,
+			MinifyIdentifiers: true,
+			MinifySyntax:      true,
+		})
+
+		if err != nil {
+			return "", err
+		}
+		block.Compiled = js
+		return js, nil
+	}
+
+	// Javascript
 	if block.Codes.JS.Code == "" {
 		return "", fmt.Errorf("Block %s has no JS code", block.ID)
 	}
 
-	js := strings.Replace(block.Codes.JS.Code, "export default", fmt.Sprintf("window.block__%s =", block.ID), 1)
+	varName := strings.Replace(block.ID, "-", "_", -1)
+	js := strings.Replace(block.Codes.JS.Code, "export default", fmt.Sprintf("window.block__%s =", varName), 1)
 	if block.Codes.HTML.Code != "" && !strings.Contains(block.Codes.JS.Code, "content:") {
 		html := strings.ReplaceAll(block.Codes.HTML.Code, "`", "\\`")
 		js = strings.Replace(js, "{", fmt.Sprintf("{\n  content: `%s`,", html), 1)
 	}
 
-	block.Compiled = js
+	minified, err := transform.MinifyJS(js)
-	return js, nil
+	if err != nil {
+		return "", err
+	}
+
+	block.Compiled = minified
+	return minified, nil
 }

sui/storages/local/block.go

@@ -8,12 +8,24 @@ import (
 func (block *Block) Load() error {
 
 	root := filepath.Join(block.tmpl.Root, "__blocks")
-	jsFile := filepath.Join(root, block.Codes.JS.File)
+
-	jsCode, err := block.tmpl.local.fs.ReadFile(jsFile)
+	// Type script is the default language
-	if err != nil {
+	tsFile := filepath.Join(root, block.Codes.TS.File)
-		return err
+	if exist, _ := block.tmpl.local.fs.Exists(tsFile); exist {
+		tsCode, err := block.tmpl.local.fs.ReadFile(tsFile)
+		if err != nil {
+			return err
+		}
+		block.Codes.TS.Code = string(tsCode)
+
+	} else {
+		jsFile := filepath.Join(root, block.Codes.JS.File)
+		jsCode, err := block.tmpl.local.fs.ReadFile(jsFile)
+		if err != nil {
+			return err
+		}
+		block.Codes.JS.Code = string(jsCode)
 	}
-	block.Codes.JS.Code = string(jsCode)
 
 	htmlFile := filepath.Join(root, block.Codes.HTML.File)
 	if exist, _ := block.tmpl.local.fs.Exists(htmlFile); exist {

sui/storages/local/template.go

@@ -160,6 +160,7 @@ func (tmpl *Template) getBlock(id string) (core.IBlock, error) {
 	}
 
 	jsFile := filepath.Join("/", id, "main.js")
+	tsFile := filepath.Join("/", id, "main.ts")
 	htmlFile := filepath.Join("/", id, "main.html")
 	block := &Block{
 		tmpl: tmpl,
@@ -168,6 +169,7 @@ func (tmpl *Template) getBlock(id string) (core.IBlock, error) {
 			Codes: core.SourceCodes{
 				HTML: core.Source{File: htmlFile},
 				JS:   core.Source{File: jsFile},
+				TS:   core.Source{File: tsFile},
 			},
 		},
 	}

sui/storages/local/template_test.go

@@ -82,17 +82,20 @@ func TestTemplateBlocks(t *testing.T) {
 	assert.Equal(t, "columns-two", blocks[0].(*Block).ID)
 	assert.Equal(t, "/columns-two/main.html", blocks[0].(*Block).Codes.HTML.File)
 	assert.Equal(t, "/columns-two/main.js", blocks[0].(*Block).Codes.JS.File)
+	assert.Equal(t, "/columns-two/main.ts", blocks[0].(*Block).Codes.TS.File)
 
 	assert.Equal(t, "hero", blocks[1].(*Block).ID)
 	assert.Equal(t, "/hero/main.html", blocks[1].(*Block).Codes.HTML.File)
 	assert.Equal(t, "/hero/main.js", blocks[1].(*Block).Codes.JS.File)
+	assert.Equal(t, "/hero/main.ts", blocks[1].(*Block).Codes.TS.File)
 
 	assert.Equal(t, "section", blocks[2].(*Block).ID)
 	assert.Equal(t, "/section/main.html", blocks[2].(*Block).Codes.HTML.File)
 	assert.Equal(t, "/section/main.js", blocks[2].(*Block).Codes.JS.File)
+	assert.Equal(t, "/section/main.ts", blocks[2].(*Block).Codes.TS.File)
 }
 
-func TestTemplateBlock(t *testing.T) {
+func TestTemplateBlockJS(t *testing.T) {
 	tests := prepare(t)
 	defer clean()
 
@@ -109,6 +112,27 @@ func TestTemplateBlock(t *testing.T) {
 	assert.Equal(t, "columns-two", block.(*Block).ID)
 	assert.NotEmpty(t, block.(*Block).Codes.HTML.Code)
 	assert.NotEmpty(t, block.(*Block).Codes.JS.Code)
-	assert.Contains(t, block.(*Block).Compiled, "window.block__columns-two")
+	assert.Contains(t, block.(*Block).Compiled, "window.block__columns_two")
 	assert.Contains(t, block.(*Block).Compiled, `<div class="columns-two-left"`)
 }
+
+func TestTemplateBlockTS(t *testing.T) {
+	tests := prepare(t)
+	defer clean()
+
+	tmpl, err := tests.Demo.GetTemplate("tech-blue")
+	if err != nil {
+		t.Fatalf("GetTemplate error: %v", err)
+	}
+
+	block, err := tmpl.Block("hero")
+	if err != nil {
+		t.Fatalf("Blocks error: %v", err)
+	}
+
+	assert.Equal(t, "hero", block.(*Block).ID)
+	assert.Empty(t, block.(*Block).Codes.HTML.Code)
+	assert.NotEmpty(t, block.(*Block).Codes.TS.Code)
+	assert.Contains(t, block.(*Block).Compiled, "window.block__hero")
+	assert.Contains(t, block.(*Block).Compiled, `<div data-gjs-type='nav'></div>`)
+}