express-tsx

express view engine

4.2.1
Source
npm

Version published: 7 years ago

Weekly downloads: 33; increased by371.43%

Maintainers: 1

Weekly downloads

Created: 8 years ago

Source

介绍

express 视图引擎 tsx 的实现 .

安装

npm install express-tsx typescript --save

使用示例

主文件

//创建包含 express-tsx 视图引擎的 express 服务
const { expressTsx,expressTsxMiddleware } = require('../')
const server = expressTsx(__dirname)
//服务监听
server.listen(9000,function(){ console.log(`server is running on ${this.address().port}`) })
//**注意**:在渲染视图前需要根路由注入中间件
server.use(expressTsxMiddleware)
//渲染视图
server.use('/',(req,res)=>res.render('./view.tsx'))

视图文件

import React = require('react')
console.log('express-tsx' as any)
export default ()=>
<div>
  hello world
</div>

示例运行

克隆本项目

git clone https://github.com/shynome/express-tsx.git

安装依赖 ; 进入示例目录 ; 运行
```
npm install ; node example
```
在浏览器中打开示例:http://127.0.0.1:9000/
一切正常的话会看到 : hello world

实现流程

使用require('express-tsx').middleware中间件用来注入要使用的数据
express 中指定要渲染的文件 , app.use('/path',(req,res)=>res.render(file))
使用 typescript 将该文件及其引用的文件进行编译
调用用 res.locals.express_tsx_html 函数返回用来渲染界面的html文件
通过require('express-tsx').middleware返回编译成es5的js文件
浏览器通过 browser.int.ts 渲染界面

深入使用

示例1

替换 `res.locals.express_tsx_html` 函数来输入你自己的 `html` 结构来应对 `seo` 等情况

替换res.locals.express_tsx_html函数, 相关代码片段:
源文件

const render2 = expressTsx(__dirname)
render2.use((req,res,next)=>{
  let originTsxHTML = res.locals.express_tsx_html
  res.locals.express_tsx_html = async(...r)=>{
    return (await originTsxHTML(...r)).replace(`<body>`,`<body>render by diy html function`)
  }
  next()
})
render2.use('/',(req,res)=>res.render(renderFile))

Keywords

FAQs

What is express-tsx?

Is express-tsx popular?

Is express-tsx well maintained?

Package last updated on 01 Aug 2017

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install