先安装react - 18 npm install -g create-react-app npm install -g react-dom 修改package.json配置文件的scripts // 指定electron入口文件"main":"main.js","homepage":".","scripts":{"start":"react-scripts start","build":"react-scripts build","test":"react-scripts test","eject":"react-scri...
然后修改src/App.js 来验证下Antd: import{Button}from'antd'functionApp(){return(Electron-CRA<Buttontype="primary">Button</Button>)}exportdefaultApp 执行yarn start: 可以看到Antd的Button组件正常显示出来了。 ※注: Antd 5.x已经没有全局污染的reset样式了。因此不用再担心使用了Antd会影响页面样式。
你安装create-react-app成功之后,就能直接在WebStorm中使用集成创建项目的方法创建一个React项目,创建项目的时候选择到React App一栏,WebStorm会自动识别到create-react-app以供你创建项目: WebStorm创建项目 第一栏是你项目的位置,自己选一个并且取好项目名即可,第三栏如果报红色错误则说明你的create-react-app工具没...
3) src下新建 index.js 文件 index.js为react项目入口文件 // src/index.jsimportReactfrom"react"import{ createRoot }from"react-dom/client";importAppfrom"./app";import'antd/dist/reset.css';import'./index.css'constrootElement =document.getElementById("root");constroot =createRoot(rootElement);...
搭建Electron24+React18+Antd5架构工程的步骤主要包括以下四个方面:一、项目初始化 利用CreateReactApp快速搭建项目:确保使用最新版本,以快速启动React项目。 精简项目结构:仅保留核心依赖,去除不必要的包,以保持项目的轻量和高效。 配置Webpack:支持Sass、Scss、Less和Stylus等多种样式语言,以满足不...
在2019年7月,我发布了《手把手教你使用Electron5+vue-cli3开发跨平台桌面应用》,2020年5月,我又发布了《超详实!带你一步步搭建Electron10+React16+Antd架构工程》,时隔一年多的现在,Electron已经发布到了17版本。不仅仅是Electron本身,包括React及相关的组件也迭代了很多版本,很多方面也发生了较大的变化,之前的...
Electron + Antd + Mobx 环境搭建 最近要重构一版桌面管理软件。业务需求与WEB版基本一致,但需要用到断点续传等本地功能。最经济的办法当然是移植到Electron环境中。 之前的应用框架主要用到了以下React套餐: React React-Router 路由 Mobx 数据管理 AntDesign 界面组件...
一、项目初始化 1.1 利用Create-React-App快速搭建项目,确保使用最新版本 1.2 精简项目结构,仅保留核心依赖 1.3 配置Webpack,支持Sass、Scss、Less和Stylus 1.4 设置路径别名和禁止生成map文件 二、项目架构搭建 2.1 优化项目目录结构,增强可维护性 2.2 样式命名规范,提升代码可读性 2.3 ...
electron-react-antd-antv-cli EdeverClient可视化客户端便于更好的获取脚手架更新动态, 基于HerbertHe/EdeverClient 环境依赖 nodejs未安装可参考 yarn(项目依托yarn进行包管理) 关于electron的镜像,electron7.x之后需要设置单独的镜像,不然会安装报错;根据官方文档,中国地区镜像为:https://cdn.npm.taobao.org/dist/...
此时我们可以运行yarn start将之前的react起始页通过桌面程序的方式打开,也可以通过执行yarn build将我们的桌面程序打包生成.exe文件进行安装 over。 electron-react 每日壁纸 🧠 既然我们可以利用react&electron构建桌面应用,就可以利用众多 npm 包去实现一个能用在生活中可以用到的功能,前段时间由于兴趣使然,接触 node...