[add] Page Builder typescript support

This commit is contained in:
Max 2023-09-24 23:42:16 +08:00
parent 137e8ad971
commit bd0dbd4db8
5 changed files with 83 additions and 11 deletions

View file

@ -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

View file

@ -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
return js, nil
minified, err := transform.MinifyJS(js)
if err != nil {
return "", err
}
block.Compiled = minified
return minified, nil
}

View file

@ -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)
if err != nil {
return err
// Type script is the default language
tsFile := filepath.Join(root, block.Codes.TS.File)
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 {

View file

@ -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},
},
},
}

View file

@ -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>`)
}