Skip to content

searchfe/san-ssr-target-php

Repository files navigation

san-ssr-target-php

npm version downloads Build Status Coveralls dependencies semantic-release GitHub issues David David Dev DUB license Commitizen friendly

安装

环境要求

  • PHP 5 >= 5.3.0, PHP 7
npm i san san-ssr san-ssr-target-php

编程接口

SanProject#compile(filepath, target, options) 方法第二参传 'php',第三参为 ToPHPCompiler 的 compileToSource() 选项

TypeScript 作为输入,可以支持 method、filters、computed。

import { Target, SanProject } from 'san-ssr'
import { writeFileSync } from 'fs'

const project = new SanProject()
const targetCode = project.compile('src/component.ts', 'php')

writeFileSync('dist/component.php', targetCode)

或者 JavaScript 作为输入,只支持 template:

const { SanProject } = require('san-ssr')
import { writeFileSync } from 'fs'

const project = new SanProject()
const targetCode = project.compile('src/component.ts', 'php')

writeFileSync('dist/component.php', targetCode)

默认产出的 PHP 中包含了一个 helpers 运行时工具。为了避免重复产出,可以手动维护一份 helpers 并让每次编译使用外部 helpers:

import { SanProject } from 'san-ssr'
import ToPHPCompiler from 'san-ssr-target-php'
import { writeFileSync } from 'fs'

// 指定 importHelpers,targetCode 中不产出 helpers 代码
const project = new SanProject()
const targetCode = project.compile('src/component.ts', 'php', {
    importHelpers: '\\san\\my-helpers'
})
writeFileSync('dist/component.php', targetCode)

// 单独产出一份 helpers,注意这里没有 "\\" 前缀
const helpersCode = ToPHPCompiler.emitHelpers({ namespace: 'san\\my-helpers' })
writeFileSync('dist/helpers.php', targetCode)

命令行接口

使用 san-ssr 命令并指定 --target php 即可调用目标到 PHP 的 SSR 渲染。

san-ssr --target php --compile '{"nsPrefix":"demo\\"}' ./component.ts > ssr.php

全局安装 san-ssr-target-php 后,可以用命令来产出一份 helpers:

$ san-ssr-target-php-helpers --help
san-ssr-target-php-helpers [-n <NAMESPACE>]

Options:
  --namespace, -n    Specify the namespace of helpers

Example:
$ san-ssr-target-php-helpers -n 'san\helpers'

已知问题

  • noDataOutput 控制的数据输出中,对象序列化使用 json_encode 实现,属性顺序和 JavaScript 中可能不同
  • getTemplateType() 需要运行时编译,不在 PHP 版本中支持。
  • 模板(san 组件的 template 属性)中读取数据属性时,有些属性是平台相关的。比如 {{ arr.length }} 总会渲染为空(因为 PHP array 下不存在 length 属性)。
  • script 元素内容不可在组件间传递。即 script 内不可引用组件,也不可包含 slot。

贡献指南

开发依赖:

安装依赖和跑测试:

npm install
composer install
npm test

debug 一个用例,以 node_modules/san-html-cases/src/array-literal 为例:

./bin/debug array-literal

source ./bin/auto-complete 来让 zsh 自动补全用例全名。