Skip to content

Commit 1a72f99

Browse files
bytesleobytesleo
committed
Updated
1 parent 0ee7074 commit 1a72f99

File tree

14 files changed

+1194
-1499
lines changed

14 files changed

+1194
-1499
lines changed

‎.babelrc‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
{
2-
"presets": ["@babel/preset-react"],
2+
"presets": ["@babel/preset-env", "@babel/preset-react"],
33
"plugins": [
44
[
55
"import",
66
{
77
"libraryName": "antd",
88
"style": true
99
}
10-
]
10+
],
11+
"@babel/plugin-proposal-class-properties",
12+
"@babel/transform-runtime"
1113
]
1214
}

‎.gitignore‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Build folder and files #
22
##########################
3-
builds/
3+
release/
44

55
# Development folders and files #
66
#################################

‎.npmignore‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
_ignore/
22
docs/
3-
builds/
3+
release/
44
dist/
55
.editorconfig
6-
code-of-conduct.md

‎.travis.yml‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
sudo: false
2+
language: node_js
3+
node_js:
4+
- node
5+
script:
6+
- yarn prod
7+
fail_fast: true

‎README.md‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ or
4343
yarn start
4444
```
4545

46-
#### Build the app (automatic)
46+
#### Build the app (Current OS)
4747

4848
```
4949
npm run package
@@ -52,6 +52,15 @@ or
5252
```
5353
yarn package
5454
```
55+
#### Build the app (Mac, Linux, Win)
56+
57+
```
58+
npm run package-all
59+
```
60+
or
61+
```
62+
yarn package-all
63+
```
5564

5665
#### Build the app (manual)
5766

‎index.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
7+
<title>My App</title>
8+
</head>
9+
<body>
10+
<div id="root"></div>
11+
</body>
12+
</html>

‎main.js‎

Lines changed: 35 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
"use strict";
22

3-
const { app, BrowserWindow } = require("electron");
3+
// Import parts of electron to use
4+
const { app, BrowserWindow, Menu } = require("electron");
45
const path = require("path");
56
const url = require("url");
67
const isDev = require("electron-is-dev");
78

9+
// Keep a global reference of the window object, if you don't, the window will
10+
// be closed automatically when the JavaScript object is garbage collected.
811
let mainWindow;
912

1013
// Temporary fix broken high-dpi scale factor on Windows (125% scaling)
@@ -15,12 +18,14 @@ if (process.platform === "win32") {
1518
}
1619

1720
function createWindow() {
21+
// Create the browser window.
1822
mainWindow = new BrowserWindow({
19-
width: 800,
20-
height: 500,
23+
width: 604,
24+
height: 670,
2125
show: false
2226
});
2327

28+
// and load the index.html of the app.
2429
let indexPath;
2530

2631
if (isDev && process.argv.indexOf("--noDevServer") === -1) {
@@ -40,28 +45,55 @@ function createWindow() {
4045

4146
mainWindow.loadURL(indexPath);
4247

48+
// Don't show until we are ready and loaded
4349
mainWindow.once("ready-to-show", () => {
4450
mainWindow.show();
4551

52+
// Open the DevTools automatically if developing
4653
if (isDev) {
4754
mainWindow.webContents.openDevTools();
55+
56+
mainWindow.webContents.on("context-menu", (e, props) => {
57+
const { x, y } = props;
58+
59+
Menu.buildFromTemplate([
60+
{
61+
label: "Inspect element",
62+
click: () => {
63+
mainWindow.inspectElement(x, y);
64+
}
65+
}
66+
]).popup(mainWindow);
67+
});
4868
}
4969
});
5070

71+
// Emitted when the window is closed.
5172
mainWindow.on("closed", function() {
73+
// Dereference the window object, usually you would store windows
74+
// in an array if your app supports multi windows, this is the time
75+
// when you should delete the corresponding element.
5276
mainWindow = null;
5377
});
5478
}
5579

80+
// This method will be called when Electron has finished
81+
// initialization and is ready to create browser windows.
82+
// Some APIs can only be used after this event occurs.
5683
app.on("ready", createWindow);
5784

85+
// Quit when all windows are closed.
5886
app.on("window-all-closed", () => {
87+
// On macOS it is common for applications and their menu bar
88+
// to stay active until the user quits explicitly with Cmd + Q
5989
if (process.platform !== "darwin") {
6090
app.quit();
6191
}
6292
});
6393

6494
app.on("activate", () => {
95+
// On macOS it's common to re-create a window in the app when the
96+
// dock icon is clicked and there are no other windows open.
6597
if (mainWindow === null) {
6698
createWindow();
6799
}

‎package.json‎

Lines changed: 59 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
{
22
"name": "electron-react-ant-boilerplate",
3-
"version": "1.0.0",
4-
"description": "Electron, Webpack, React, Babel 7, Es6, PostCSS, Less, Ant Design",
3+
"version": "1.0.1",
4+
"description": "Electron, Webpack, React, Babel 7, ES6, PostCSS, Less, Ant Design",
55
"license": "MIT",
66
"private": false,
77
"repository": {
88
"type": "git",
9-
"url": ""
9+
"url": "git+https://github.com/kevoj/electron-react-ant-boilerplate.git"
1010
},
1111
"author": {
1212
"name": "Leonardo",
1313
"email": "leonardo.ricog@gmail.com",
14-
"url": "git+https://github.com/kevoj/electron-react-ant-boilerplate.git"
14+
"url": "https://github.com/kevoj"
1515
},
1616
"keywords": [
1717
"app",
@@ -35,38 +35,42 @@
3535
"npm": ">=5.0.0",
3636
"yarn": ">=1.0.0"
3737
},
38+
"homepage": "",
3839
"main": "main.js",
3940
"scripts": {
40-
"prod": "webpack --mode production --config webpack.build.config.js && electron --noDevServer .",
41-
"start": "webpack-dev-server --hot --host 0.0.0.0 --config=./webpack.dev.config.js --mode development",
42-
"build": "webpack --config webpack.build.config.js --mode production",
41+
"prod": "node -r @babel/register & webpack --mode production --config webpack.prod.config.babel.js && electron --noDevServer .",
42+
"start": "node -r @babel/register & webpack-dev-server --hot --host 0.0.0.0 --config=./webpack.dev.config.babel.js --mode development",
43+
"build": "node -r @babel/register & webpack --config webpack.prod.config.babel.js --mode production",
4344
"package": "npm run build",
44-
"postpackage": "electron-packager ./ --out=./builds --platform=darwin,linux,win32 --arch=x64"
45+
"postpackage": "electron-builder build",
46+
"package-all": "npm run build",
47+
"postpackage-all": "electron-builder build -mwl"
4548
},
4649
"dependencies": {
47-
"antd": "^3.13.6",
50+
"antd": "^3.14.1",
4851
"electron-is-dev": "^1.0.1",
49-
"install": "^0.12.2",
50-
"npm": "^6.8.0",
5152
"react": "^16.8.3",
5253
"react-dom": "^16.8.3",
5354
"react-router-dom": "^4.3.1"
5455
},
5556
"devDependencies": {
5657
"@babel/core": "^7.3.4",
58+
"@babel/plugin-proposal-class-properties": "^7.3.4",
59+
"@babel/plugin-transform-runtime": "^7.3.4",
60+
"@babel/preset-env": "^7.3.4",
5761
"@babel/preset-react": "^7.0.0",
62+
"@babel/register": "^7.0.0",
5863
"babel-loader": "^8.0.5",
5964
"babel-plugin-import": "^1.11.0",
6065
"babili-webpack-plugin": "^0.1.2",
6166
"css-loader": "^2.1.0",
6267
"electron": "^4.0.6",
63-
"electron-packager": "^13.1.0",
68+
"electron-builder": "^20.38.5",
6469
"file-loader": "^3.0.1",
6570
"html-webpack-plugin": "^3.2.0",
6671
"less": "^3.9.0",
6772
"less-loader": "^4.1.0",
6873
"less-vars-to-js": "^1.3.0",
69-
"mini-css-extract-plugin": "^0.5.0",
7074
"postcss-import": "^12.0.1",
7175
"postcss-loader": "^3.0.0",
7276
"postcss-nested": "^4.1.2",
@@ -76,5 +80,47 @@
7680
"webpack": "^4.29.6",
7781
"webpack-cli": "^3.2.3",
7882
"webpack-dev-server": "^3.2.1"
83+
},
84+
"build": {
85+
"productName": "MyApp",
86+
"appId": "org.develar.MyApp",
87+
"files": [
88+
"dist",
89+
"main.js",
90+
"package.json"
91+
],
92+
"dmg": {
93+
"contents": [
94+
{
95+
"x": 130,
96+
"y": 220
97+
},
98+
{
99+
"x": 410,
100+
"y": 220,
101+
"type": "link",
102+
"path": "/Applications"
103+
}
104+
]
105+
},
106+
"win": {
107+
"target": [
108+
"nsis",
109+
"msi"
110+
]
111+
},
112+
"linux": {
113+
"target": [
114+
"deb",
115+
"rpm",
116+
"snap",
117+
"AppImage"
118+
],
119+
"category": "Development"
120+
},
121+
"directories": {
122+
"buildResources": "resources",
123+
"output": "release"
124+
}
79125
}
80126
}

‎postcss.config.js‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
11
module.exports = {
22
plugins: {
3-
'postcss-cssnext': {
3+
"postcss-cssnext": {
44
browsers: [
5-
'Firefox >= 58',
6-
'Chrome >= 62',
7-
'ie >= 10',
8-
'last 4 versions',
9-
'Safari >= 9'
5+
"Firefox >= 58",
6+
"Chrome >= 62",
7+
"ie >= 10",
8+
"last 4 versions",
9+
"Safari >= 9"
1010
]
1111
},
12-
'postcss-import': {},
13-
'postcss-pxtorem': {
12+
"postcss-import": {},
13+
"postcss-pxtorem": {
1414
rootValue: 16,
1515
unitPrecision: 5,
16-
propList: ['*'],
17-
selectorBlackList: ['html', 'body'],
16+
propList: ["*"],
17+
selectorBlackList: ["html", "body"],
1818
replace: true,
1919
mediaQuery: false,
2020
minPixelValue: 0
2121
},
22-
'postcss-nested': {}
22+
"postcss-nested": {}
2323
}
24-
}
24+
};

‎src/index.js‎

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,6 @@
1-
import React from 'react';
2-
import { render } from 'react-dom';
3-
import App from './routes';
1+
import React from "react";
2+
import { render } from "react-dom";
3+
import App from "./routes";
4+
import "./assets/styles/App.css";
45

5-
// Since we are using HtmlWebpackPlugin WITHOUT a template, we should create our own root node in the body element before rendering into it
6-
let root = document.createElement('div');
7-
8-
root.id = 'root';
9-
document.body.appendChild(root);
10-
11-
// Now we can render our application into it
12-
render(<App />, document.getElementById('root'));
6+
render(<App />, document.getElementById("root"));

0 commit comments

Comments
 (0)