- 博客(11)
- 收藏
- 关注
RSS订阅原创 React 框架原理与实战——04-04-React服务端渲染专题(原生实现，next.js集成框架，Gatsby)
文章目录1. ReactSSR1.1 服务器端渲染1.1.1 实现React SSR1.1.2 webpack 打包配置1.1.3项目启动命令配置1.2 客户端 React 附加事件1.2.1 实现思路分析1.2.2 客户端二次“渲染” hydrate1.2.3 客户端 React 打包配置1.2.4 添加客户端包文件请求链接1.2.5 服务器端实现静态资源访问1.3 优化1.3.1 合并 webpack 配置1.3.2合并项目启动命令1.3.3 服务器端打包文件体积优化1.3.4 将启动服务器代码和渲染代
2021-03-04 09:31:06
374
原创 React 框架原理与实战——04-03-React Hooks、Chakra-UI、组件性能优化、封装组件库
文章目录1.Hooks2.Formik3.Component4.CSS-IN-JS5.ChakraUI5.1 Chakra-UI 介绍5.2 Chakra-UI 快速开始5.2.1 下载 Chakra-UI5.2.2克隆默认主题5.2.3引入主题5.2.3引入CSS重置样式5.3 样式属性5.4 主题5.4.1 颜色模式（color mode）5.4.2 根据颜色模式设置样式 1.Hooks 2.Formik 3.Component 4.CSS-IN-JS 5.ChakraUI 5.1 Chakra-UI
2021-03-02 14:10:18
578
1
原创 前端工程化实战-开发脚手架及封装自动化构建工作流＞ 工程化的定义和主要解决的问题- 02-01-03自动化构建
文章目录1.自动化构建基本介绍2.自动化构建体验3.常用的自动化构建工具4.Grunt的基本使用5.Grunt标记任务失败6.Grunt的配置方法7.Grunt的多目标任务8.Grunt插件的使用9.Grunt常用插件及总结10.Grunt的基本使用11.Grunt的组合任务12.13.14.15.16.17.18.19.20.总结 1.自动化构建基本介绍 自动化构建是前端工程化中重要组成部分， 就是把开发阶段源代码自动转化成生产环境当中可以运行的代码或者程序 自动化构建工作流 2.自动化构建体验 3.
2021-02-22 23:15:41
164
原创 前端工程化实战-模块化开发与规范标准-02-02-01模块化开发
文章目录模块化开发1.模块化演变过程Stage1 文件划分方式Stage2 命名空间方式Stage3 IIFE 立即执行函数2.模块化规范CommonJS规范AMD(Asynchronous Module Definition)异步模块规范淘宝推出的Sea.js + CMD(Common Module Definition)通用模块规范3.模块化标准规范4.ES Modules1.ES Module 导入导出的注意事项2.3.4.5.5.6.7.8.9.10. 模块化开发 模块化开发时当前最重要的前端开发范
2021-02-22 22:18:53
110
原创 前端工程化实战-开发脚手架及封装自动化构建工作流＞ 工程化的定义和主要解决的问题- 02-01-02脚手架工具
文章目录1.概要2.常用的脚手架工具3.Yeoman - 简介4.Yeoman - 基本使用5.sub Generator6.Yeoman 使用步骤总结7.自定义 Generator8.创建 Generator 模块9.根据模板创建文件步骤10.接收用户输入数据11.vue Generator 案例12.发布 Generator13.Plop14.Plop基本使用15.脚手架的工作原理 1.概要 因为在前端工程中，可能会有： 相同的组织结构 相同的开发范式 相同的模块依赖 相同的工具配置 相同的基础代码
2021-02-19 23:06:36
177
原创 前端工程化实战-开发脚手架及封装自动化构建工作流＞ 工程化的定义和主要解决的问题- 02-01-01工程化概述
文章目录1. 前端工程化定义 和前端开发中遇到的问题2.工程化表现3.工程化 不等于 某个工具4.工程化 与 Node.js总结：接下来主体内容 1. 前端工程化定义 和前端开发中遇到的问题 定义 前端工程化是指遵循一定的标准和规范，通过工具去提高效率、降低成本的一种手段 日常问题举例 想要使用ES6+新特性，但是兼容有问题 想要使用Less/Sass/PostCSS增强CSS的编程性，但是运行环境不能直接支持 想要使用模块化的方式提高项目的可维护性，但运行环境不能直接支持 部署上线前需要手动压缩代码及
2021-02-18 22:29:59
177
原创 React 框架原理与实战-React 框架原理与实战-04-01-01React基础回顾
文章目录一、React 介绍？二、JSX 语法2.1 在 JSX 中使用表达式2.2 属性2.3 JSX 单标记必须闭合2.4 className2.5 JSX 自动展开数组2.6 三元运算2.7 循环2.8 事件2.9 样式2.9.1 行内样式2.9.2 外链样式2.9.3 全局样式2.10 ref 属性2.10.1 createRef2.10.2 函数参数2.10.3 ref 字符串2.10.4 获取组件实例3. 组件3.1 什么是组件3.2 创建组件3.2.1 创建类组件3.2.2 创建函数组件3.
2021-02-18 21:52:41
225
原创 vue项目实战
文章目录一、使用vueCli创建项目？二、加入Git版本管理三、初始化目录介绍四、调整目录结构1.修改 App.vue2.修改 router/index.ts3.删除默认示例⽂件：4.创建以下内容：5.修改后的目录结构五、使用TS开发Vue1.环境说明2.相关配置说明3.使用OptionsAPI定义Vue组件4. 使用ClassAPIs定义Vue组件5.关于装饰器语法6.使用vuePropertyDecorator创建Vue组件7.总结创建组件方式六、基础处理1.导入elementUI2.样式的处理3.共享
2021-02-17 14:11:07
1010
原创 大前端 -- 03-01-2 手写 Vue Router
手写 Vue Router 文章目录手写 Vue Router一、基础回顾？二、使用步骤1.创建 router 对象，router/index.js2.注册 router 对象，main.js3.创建路由组建的占位，创建链接 App.vue三 动态路由四 嵌套路由五 编程式导航六 Hash 模式 和 History 模式的区别1. 表现形式的区别2. 原理的区别3. History模式的使用4. Hash模式5. History模式七 实现自己的vue-router八 完整版代码 一、基础回顾？ Vue
2021-02-05 16:07:00
79
原创 vue3.0CompositionAPIs及3.0原理 todoList使用
vue3.0CompositionAPIs及3.0原理 文章目录vue3.0CompositionAPIs及3.0原理一、3.0介绍1、源码组织方式2、不同构建版本3、Composition API设计动机4、性能提升1、响应式系统升级2. 编译优化3.源码体积的优化5 Vite1.ES Module2.Vite as Vue-CLI3.Vite特点4.Vite创建项目二、使用步骤1.引入库2.读入数据总结 一、3.0介绍 源码组织方式的改变 Composition API 性能提升 Vite 1、源码
2021-01-24 10:35:03
335
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人