文章 2023-11-01 来自:开发者社区

超越React,JS代码体积减少90%!它为何是2023年最好的Web框架?

说到Web框架,大家最先想到的可能是 Vue、React,或者是Next.js。但不得不提,有个后起之秀“来势汹汹”,1.0版本发布至今仅一年,就出尽风头。它就是Astro。Astro 是什么?一个现代化的静态站点生成器和前端框架。它允许开发人员使用组件化的方式构建内容优先的网站。2022 年,Astro在JavaScript明星项目中排名第七,一年新增了15k star!顺带一提,Astro ....

超越React,JS代码体积减少90%!它为何是2023年最好的Web框架?
文章 2023-10-11 来自:开发者社区

React-组件-CSS-In-JS重要特性

styled-components 特性props在前面的文章当中介绍了一个 styled-compoents 的一个动态修改状态的特性,这个特性就是借助 props 来实现的,如下, 假如我现在有这么一个需求就是点击一个按钮修改一下 p 标签的颜色:import React from 'react'; import styled from 'styled-components'; const ....

React-组件-CSS-In-JS重要特性
文章 2023-10-11 来自:开发者社区

React-组件-CSS-In-JS

前言React组件CSS-in-JS是一种流行的前端开发技术,它将组件的JavaScript逻辑与样式定义结合在一起,以提高代码的可维护性和可重用性。通过CSS-in-JS,开发者可以在组件级别轻松管理样式,而不必担心全局污染或类名冲突。这种方法使用JavaScript对象来描述样式,这些对象可以根据组件的状态或属性进行动态计算,从而实现高度灵活的样式处理。常见的React CSS-in-JS库....

React-组件-CSS-In-JS
文章 2023-09-28 来自:开发者社区

React craco 详细使用与介绍(类似 Vue 外抛的 vue.config.js)

一、简介craco 官方文档、craco Github。craco 是一个用于扩展 Create React App(CRA)的工具,CRA 是一个用于快速搭建 React 应用的脚手架工具。CRA 提供了一个简单的项目结构和配置,使得开发者可以快速开始一个 React 项目的开发。然而 CRA 的配置是被隐藏的,开发者无法对其进行自定义和扩展。这就是 craco 出现的原因。craco(Cre....

文章 2023-09-28 来自:开发者社区

React 配置别名 @ ( js/ts 项目中通过 webpack.config.js 配置)

一、简介在 Vue 项目当中,可以使用 @ 来表示 src/,但在 React 项目中,默认却没有该功能,因此需要进行手动的配置来实现该功能。别名主要解决的问题:每个页面都使用路径的方式进行引入,这样很麻烦,效率很低,这个时候可以配置一个别名,来直接使用别名引入。使用 @craco/craco 可以在不释放 React 隐藏配置($ npm run eject)的情况下就能配置好别名,参考文章。....

文章 2023-09-28 来自:开发者社区

React 配置别名 @ ( js/ts 项目中通过 @craco/craco 配置)

一、简介在 Vue 项目当中,可以使用 @ 来表示 src/,但在 React 项目中,默认却没有该功能,因此需要进行手动的配置来实现该功能。别名主要解决的问题:每个页面都使用路径的方式进行引入,这样很麻烦,效率很低,这个时候可以配置一个别名,来直接使用别名引入。使用 @craco/craco 的这种方式,可以在不释放 React 隐藏配置($ npm run eject)的情况下就能解决。Re....

文章 2023-09-16 来自:开发者社区

React 框架下如何集成 H.265 流媒体视频播放器 EasyPlayer.js?

H5 无插件流媒体播放器 EasyPlayer 属于一款高效、精炼、稳定且免费的流媒体播放器,可支持多种流媒体协议播放,可支持 H.264 与 H.265 编码格式,性能稳定、播放流畅,能支持 WebSocket-FLV、HTTP-FLV,HLS(m3u8)、WebRTC 等格式的视频流。在功能上&...

文章 2023-08-08 来自:开发者社区

react源码解析手写ReactDom.js和React

前言大家好 我是歌谣 今天给大家带来react源码部分的实现创建项目首先npx create-react-app xxx降为17"dependencies": { "@testing-library/jest-dom": "^5.11.4", "@testing-library/react": "^11.1.0", "@testing-library/user-event...

react源码解析手写ReactDom.js和React
文章 2023-08-07 来自:开发者社区

【React工作记录九十一】Viewer.js实现图片预览效果

前言大家好 我是歌谣 今天要说的是一个需求图片可以实现一个预览的结果最近涉及一个移动端项目需要把其中的图片变成可预览的图片 听学弟说 可以利用viewer进行实现首先我们需要做的就是先写一个简单demo 先实现其中的效果 2021年的事情了实现效果基本案例```Document rel="stylesheet" href="https://unpkg.com/bootstrap@4/dist/c....

【React工作记录九十一】Viewer.js实现图片预览效果
文章 2023-08-03 来自:开发者社区

React Proxy 详细流程与配置方式(webpack、setupProxy.js、package.json)

一、 package.json 配置方式全部以 GET 请求为例,每次修改配置后,重启项目,否则不生效。访问 http://127.0.0.1:6000/api/user/list 接口为例检查自己脚手架版本$ create-react-app -V若脚手架版本在 2.0 以下,可以使用对象类型配置代理,在项目的 package.json 文件中配置如下:"proxy": { "/api":...

React Proxy 详细流程与配置方式(webpack、setupProxy.js、package.json)

本页面内关键词为智能算法引擎基于机器学习所生成,如有任何问题,可在页面下方点击"联系我们"与我们沟通。

产品推荐

开发与运维

集结各类场景实战经验,助你开发运维畅行无忧

+关注