【前端直播资料】利用编译将 Vue 组件转成 React 组件

简介: 在前端日常工作中,我们接触编译主要在代码构建上。除此之外,我们还能利用编译做什么事情呢。本次分享希望通过 Vue 组件代码转 React 组件代码为例,给听众介绍 Babel 相关工程实践。

课程介绍

在前端的日常工作中,大家接触编译主要是在代码构建,例如 Babel 将 ECMAScript 2015+ 版本的代码转成能在当前浏览器环境下运行的代码。那基于编译是否能做不同框架下前端代码的转化呢?

本次直播将从 Vue 组件转 React 组件这样一个实际工程实践入手,向大家介绍基于编译、Babel、AST 分析如何做代码转化。

课程大纲

  • Babel 是如何工作的
  • AST 是什么
  • Vue 和 React API上的异同
  • 解析 Vue 代码
  • 转化 React 代码

专家介绍

_2019_04_21_4_47_03

陈哲(玉缜)

阿里巴巴闲鱼团队,经历了闲鱼前端技术体系整体发展,目前主要负责闲鱼前端工程体系相关

课后回顾

直播回放点击观看

PPT下载点击下载

直播详情

时间:2019年4月23日 19:00

地点:前端技术钉钉群 扫码观看更多直播及往期回顾

_

目录
相关文章
|
3天前
|
前端开发 测试技术 开发工具
探索前端框架React Hooks的优势与应用
本文将深入探讨前端框架React Hooks的优势与应用。通过分析React Hooks的特性以及实际应用案例,帮助读者更好地理解和运用这一现代化的前端开发工具。
|
18天前
|
JavaScript 前端开发 API
详解React与Vue的性能对比
详解React与Vue的性能对比
59 0
|
1月前
|
JavaScript 前端开发
vue前端下载,实现点击按钮弹出本地窗口,选择自定义保存路径
这个不用代码实现(网上也找不到方法可以调出另存为窗口),更改浏览器设置就可以,否则,现在的浏览器都是默认直接保存到下载路径中
65 3
|
24天前
|
前端开发 应用服务中间件 nginx
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
99 0
|
3天前
|
缓存 安全 JavaScript
前端安全:Vue应用中防范XSS和CSRF攻击
【4月更文挑战第23天】本文探讨了在Vue应用中防范XSS和CSRF攻击的重要性。XSS攻击通过注入恶意脚本威胁用户数据,而CSRF则利用用户身份发起非授权请求。防范措施包括:对输入内容转义、使用CSP、选择安全的库;采用Anti-CSRF令牌、同源策略和POST请求对抗CSRF;并实施代码审查、更新依赖及教育团队成员。通过这些实践,可提升Vue应用的安全性,抵御潜在攻击。
|
7天前
|
NoSQL JavaScript 前端开发
报错场景:ant design vue前端登录时,输入的验证码是对的,但是一直提上验证码错误,登录不进去 报错信息(Error in execution; nested exception)
报错场景:ant design vue前端登录时,输入的验证码是对的,但是一直提上验证码错误,登录不进去 报错信息(Error in execution; nested exception)
18 0
|
15天前
|
JavaScript 前端开发 API
游戏开发入门:Python后端与Vue前端的协同工作方式
【4月更文挑战第11天】使用Python后端(Flask或Django)和Vue.js前端开发游戏变得流行,能提高开发效率和可维护性。本文指导如何构建这样的项目,包括设置环境、创建虚拟环境、搭建后端API及前端Vue组件,强调前后端协作和API接口的重要性。这种架构促进团队合作,提升代码质量和游戏体验。
|
16天前
|
供应链 JavaScript 前端开发
使用Django和Vue实现电子商务网站的后端和前端
【4月更文挑战第10天】本文介绍了使用Django和Vue构建电子商务网站的后端与前端方法。Django作为Python的Web框架负责后端,其模型-视图-控制器设计简化了商品管理、购物车和订单处理。Vue.js用于前端,提供数据驱动和组件化的用户界面。通过定义Django模型和视图处理请求,结合Vue组件展示商品和管理购物车,开发者可构建交互性强的电商网站。虽然实际开发涉及更多细节,但本文为入门提供了基础指导。
|
24天前
|
JavaScript 前端开发 算法
vue与react的区别?
vue与react的区别?
13 1
|
1月前
|
前端开发 API 项目管理
云效常见问题之编译前端的时候报了个错说证书过期如何解决
云效(CloudEfficiency)是阿里云提供的一套软件研发效能平台,旨在通过工程效能、项目管理、质量保障等工具与服务,帮助企业提高软件研发的效率和质量。本合集是云效使用中可能遇到的一些常见问题及其答案的汇总。
22 0