基于 React Typescript Webpack 构建 Electron 应用脚手架。
- babel 转换支持
- typescript 支持
- react 支持
- sass 支持
- less 支持
- hbs 文件 模板支持
- png|svg|jpg|jpeg|gif 引入支持
- git commit hooks, no 💩
安装依赖先
$ yarn
然后可执行如下脚本命令:
# 开发服务启动
$ yarn serve
# Lint 格式化
$ yarn lint
# 源构建输出
$ yarn dist
# 根据当前系统构建
$ yarn build
# 基于 dist 输出,根据当前系统构建
$ yarn build:now
# 构建 Windows 二进制
$ yarn build:windows
# 构建 Mac 二进制
$ yarn build:mac
# 构建 Linux 二进制
$ yarn build:linux
# 构建三平台
$ yarn build:all
主要依赖库:
- electron-builder
- eslint
- babel
- css-loader
- less
- sass
- typescript
- webpack
- prettier
- antd
- @ant-design/icons
- react-icons
- normalize.css
- @emotion/react
- @emotion/styled
├── app.config.js // 基础配置
├── babel.config.js // babel 配置
├── build // 打包输出文件夹
│ ├── binary // 二进制打包输出
│ └── bundle // renderer main打包源输出
├── config // 打包配置
│ ├── dev.js // 开发监听启动
│ ├── dist.js // 发布打包源
│ ├── webpack.main.js // background 编译
│ └── webpack.renderer.js // renderer 编译
├── electron.builder.js // electron.builder 二进制打包配置
├── global.d.ts // typescript 全局声明
├── lint-staged.config.js // git commit 钩子
├── public // 静态文件
├── src // 页面源
│ ├── App.less // 入口样式
│ ├── assets // 资源文件
│ ├── background.ts // electron background
│ ├── config // 应用配置
│ ├── hook // hook
│ ├── index.tsx // entry file
│ ├── layout // 布局
│ ├── type // 声明文件
│ └── utils // 工具
└── tsconfig.json // typescript 配置
└── tslint.json // tslint 配置
点击这里访问 基于 typescript 和 webapck 的 React 脚手架应用。
如果你有任何的想法或者意见,欢迎提 Issue 或者 PR。
MIT License © 2021 funnyzak