使用tailor 轻松方便的集成web 框架react&&vue
tailor 是一款很方便的layout 服务,类似facebook 的bigpipe,我们可以使用此工具
方便的集成各类web 框架,实现micro-fronteds 开发
参考demo
https://github.com/rongfengliang/tail-react-vue
说明
代码很简单,是从github 上集成合并的
https://github.com/tsnolan23/tailor-react-spa && https://github.com/shershen08/tailor-vue-demo
目的很简单,就是一个简单的集成测试
运行说明
- 初始化依赖
因为使用了lerna
- 启动依赖服务
yarn start-fragments
- 启动tailor 服务
yarn start
修改说明
主要是templates 的index.html
<!doctype html>
<html>
<head>
<title>Tailor Example Application</title>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0">
<style>
body {
background: #ECEFF4;
}
</style>
<script>
(function(d) {
require(d);
var arr = [ 'react', 'react-dom', 'prop-types', 'classnames', 'proppy', 'proppy-react'];
while (i = arr.pop())(function(dep) {
define(dep, d, function(b) {
return b[dep];
})
})(i);
}(['http://localhost:6006/public/bundle.js']));
</script>
</head>
<body>
<div id="header"></div>
<div id="dashboard"></div>
<div id="contacts"></div>
<div id="chat"></div>
+ <fragment src="http://localhost:8090"></fragment>
<fragment src="http://localhost:8081"></fragment>
<fragment src="http://localhost:5000"></fragment>
<fragment src="http://localhost:3000"></fragment>
</body>
</html>
测试效果
- UI 效果
- 资源加载
说明
tailor 的fragment 开发模型,可以加速我们micro-frontends 的开发,功能还是很强大的,v4 版本也即将发布了,新的功能还是很期待的
参考资料
https://github.com/zalando/tailor
https://github.com/tsnolan23/tailor-react-spa
https://github.com/shershen08/tailor-vue-demo
https://github.com/rongfengliang/tail-react-vue
使用tailor 轻松方便的集成web 框架react&&vue的更多相关文章
- 珠联壁合地设天造|M1 Mac os(Apple Silicon)基于vscode(arm64)配置搭建Java开发环境(集成web框架Springboot)
原文转载自「刘悦的技术博客」https://v3u.cn/a_id_194 也许有人从未听说过Python,但是不会有人没听说过Java,它作为一个拥有悠久历史的老牌编程语言,常年雄踞TIOBE编程语 ...
- Spring 4 官方文档学习(十三)集成其他web框架
重点是通用配置,非常建议看一下!有助于理解Spring的ApplicationContext与Servlet Container的关系! 1.介绍 Spring Web Flow SWF目标是成为we ...
- Spring与其他Web框架集成
Spring与多种流行Web应用框架(Struts.JSF和DWR)集成的方法. Spring强大的IoC容器和企业支持特性使其十分适于实现Java EE应用的服务和持续层. 对于表现层,可以在许多不 ...
- Spring MVC Web框架
1. Spring MVC简介 Spring MVC是java EE平台请求驱动类型的轻量级Web框架,使用了MVC设计模式的思想,spring框架的主要优势之一就是分层架构,分层架构允许选择使用 ...
- Node.js Web框架收集
原文地址:http://geek.csdn.net/news/detail/4020 框架列表: http://nodeframework.com/ 与其他很多语言一样,Node.js也有很多Web框 ...
- node.js之十大Web框架
之前接触过Node.js是因为好奇大前端越来越能干了,连我后台的饭碗都要抢了,太嚣张了,于是我想打压打压它,然后就这样接触它了.再到后来是因为Settings-Sync插件二次开发,我需要用node. ...
- 教程:在 Visual Studio 中开始使用 Flask Web 框架
教程:在 Visual Studio 中开始使用 Flask Web 框架 Flask 是一种轻量级 Web 应用程序 Python 框架,为 URL 路由和页面呈现提供基础知识. Flask 被称为 ...
- 教程:Visual Studio 中的 Django Web 框架入门
教程:Visual Studio 中的 Django Web 框架入门 Django 是高级 Python 框架,用于快速.安全及可扩展的 Web 开发. 本教程将在 Visual Studio 提供 ...
- Spring Boot + Spring Cloud 实现权限管理系统 后端篇(十一):集成 Shiro 框架
Apache Shiro 优势特点 它是一个功能强大.灵活的,优秀开源的安全框架. 它可以处理身份验证.授权.企业会话管理和加密. 它易于使用和理解,相比Spring Security入门门槛低. 主 ...
随机推荐
- js如何生成一个对象,并转化为json字符串
js如何生成一个对象,并转化为json字符串,很多人都会误写为: var ary = []; var obj = {}; for (var i = 0; i < 3; i++) { obj.na ...
- Python自动化必备发送邮件报告脚本详解
#!/usr/bin/python3# -*- coding:UTF-8 -*-import smtplib#smtplib库主要用来连接第三方smtp库,用来发邮件from email.mime.t ...
- 用FPGA对ASIC进行原型验证的过程(转)
用FPGA对ASIC进行原型验证的过程 reference:http://xilinx.eetrend.com/d6-xilinx/article/2018-10/13736.html 鉴 ...
- 安装ubuntu不能引导win7
台式机安装了ubuntu导致进不了win7了,2系统在同一硬盘. win7引导需要bootmgr和boot文件夹中的文件,2个东东在winows引导分区根目录下. 我的笔记本安装windows系统分区 ...
- ubuntu 更改hostname, hosts后没有办法执行sudo 问题
由于主机名有重复的情况,所有需要更改主机名,遇到几个问题,主机名更改,重启系统以后不能执行sudo,另外也不知道root用户名密码.这个时候陷入了死循环. 网上搜集的办法,都是用sudo 命令去更改, ...
- 18-09-08 关于Linux 的安装遇到的一些小坑
具体参考我的有道笔记 备注 那个网络问题已经解决 先自动选择打上勾 然后在进行选择 并且正确输入 IP地址之类的 ====用utrallo 制作centos7.0 报错 以下是新的工具有效===== ...
- 『转』credential Provider 简易改写攻略
本次小学期的题目是windows下的凭证改编.本人负责的是Win7 下的credentials Provider 的编写以及其他杂七杂八的工作.当然给我印象最深的就是credentials provi ...
- 一分钟使用Docker快速搭建Wordpress
1. apt install docker.io -y 2. pip install docker-compose 3. vim wordpress_stack.yml version: '3.1' ...
- Java技术体系
Shell 解释型编程语言(脚本语言都是解释型语言) Shell通过解释器/bin/bash 解释,运行在进程中 Java 编译型解释型语言(先编译再解释) Java通过编译器转换成字节码语言,再用过 ...
- [转] 带你彻底理解RSA算法原理
http://blog.csdn.net/dbs1215/article/details/48953589 1. 什么是RSA RSA算法是现今使用最广泛的公钥密码算法,也是号称地球上最安全的加密算法 ...