@tomjs/create-app 0.4.5 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/dist/index.mjs +0 -0
  2. package/package.json +11 -13
  3. package/template-config/_gitignore +1 -0
  4. package/template-electron-react/.vscode/launch.json +10 -6
  5. package/template-electron-react/README.md +69 -4
  6. package/template-electron-react/electron/main/index.ts +2 -1
  7. package/template-electron-react/electron/polyfills.ts +4 -0
  8. package/template-electron-react/package.json +4 -6
  9. package/template-electron-react/vite.config.ts +1 -1
  10. package/template-electron-vue/.vscode/launch.json +10 -6
  11. package/template-electron-vue/README.md +63 -3
  12. package/template-electron-vue/electron/main/index.ts +2 -1
  13. package/template-electron-vue/electron/polyfills.ts +4 -0
  14. package/template-electron-vue/package.json +4 -6
  15. package/template-electron-vue/vite.config.ts +1 -1
  16. package/template-node/package.json +2 -2
  17. package/template-react/package.json +1 -1
  18. package/template-vue/package.json +1 -1
package/dist/index.mjs CHANGED
File without changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tomjs/create-app",
3
- "version": "0.4.5",
3
+ "version": "0.5.0",
4
4
  "description": "create tomjs web app",
5
5
  "keywords": [
6
6
  "tomjs",
@@ -42,16 +42,6 @@
42
42
  "access": "public",
43
43
  "registry": "https://registry.npmjs.org"
44
44
  },
45
- "scripts": {
46
- "dev": "tsup --watch",
47
- "build": "tsup --minify",
48
- "lint": "run-s lint:eslint lint:stylelint lint:prettier",
49
- "lint:eslint": "eslint \"{src,template-*}/**/*.{js,cjs,ts}\" *.{js,cjs,ts} --fix --cache",
50
- "lint:stylelint": "stylelint \"template-*/**/*.{css,scss,less,vue,html}\" --fix --cache",
51
- "lint:prettier": "prettier --write \"{src,template-*}/**/*.{js,cjs,ts,json,md}\" *.{js,cjs,ts,json,md}",
52
- "prepare": "husky install",
53
- "npv": "npm run build && np --any-branch --no-yarn --yolo --no-publish --message \"chore: release v%s\""
54
- },
55
45
  "dependencies": {
56
46
  "kolorist": "^1.8.0",
57
47
  "lodash-es": "^4.17.21",
@@ -74,11 +64,19 @@
74
64
  "eslint": "^8.55.0",
75
65
  "husky": "^8.0.3",
76
66
  "lint-staged": "^15.2.0",
77
- "np": "^9.1.0",
67
+ "np": "^9.2.0",
78
68
  "npm-run-all": "^4.1.5",
79
69
  "prettier": "^3.1.1",
80
70
  "stylelint": "^15.11.0",
81
71
  "tsup": "^8.0.1",
82
72
  "typescript": "~5.2.2"
73
+ },
74
+ "scripts": {
75
+ "dev": "tsup --watch",
76
+ "build": "tsup --minify",
77
+ "lint": "run-s lint:eslint lint:stylelint lint:prettier",
78
+ "lint:eslint": "eslint \"{src,template-*}/**/*.{js,cjs,ts}\" *.{js,cjs,ts} --fix --cache",
79
+ "lint:stylelint": "stylelint \"template-*/**/*.{css,scss,less,vue,html}\" --fix --cache",
80
+ "lint:prettier": "prettier --write \"{src,template-*}/**/*.{js,cjs,ts,json,md}\" *.{js,cjs,ts,json,md}"
83
81
  }
84
- }
82
+ }
package/template-config/_gitignore CHANGED
@@ -56,3 +56,4 @@ tsconfig.tsbuildinfo
56
56
  # build output
57
57
  build
58
58
  dist
59
+ release
package/template-electron-react/.vscode/launch.json CHANGED
@@ -5,16 +5,20 @@
5
5
  "version": "0.2.0",
6
6
  "configurations": [
7
7
  {
8
- "name": "Debug Main Process",
8
+ "name": "Main Debug",
9
9
  "type": "node",
10
10
  "request": "launch",
11
- "cwd": "${workspaceRoot}",
12
- "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
11
+ "cwd": "${workspaceFolder}",
12
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
13
13
  "windows": {
14
- "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd"
14
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
15
15
  },
16
- "args": ["."],
17
- "envFile": "${workspaceRoot}/node_modules/@tomjs/vite-plugin-electron/debug/.env"
16
+ "args": [
17
+ "."
18
+ ],
19
+ "envFile": "${workspaceFolder}/node_modules/@tomjs/vite-plugin-electron/debug/.env",
20
+ "outputCapture": "std",
21
+ "console": "integratedTerminal"
18
22
  },
19
23
  ]
20
24
  }
package/template-electron-react/README.md CHANGED
@@ -8,12 +8,14 @@ vite + electron + react
8
8
 
9
9
  ```
10
10
  |--electron
11
- | |--main
11
+ | |--main // main process code
12
12
  | | |--index.ts
13
- | |--preload
13
+ | |--preload // preload process code
14
14
  | | |--index.ts
15
- |--src
16
- | |--App.vue
15
+ | |--build // electron-builder resources for electron package
16
+ | | |--icons
17
+ |--src // front-end code
18
+ | |--App.tsx
17
19
  | |--main.ts
18
20
  ```
19
21
 
@@ -31,6 +33,69 @@ vite + electron + react
31
33
  | | |--index.html
32
34
  ```
33
35
 
36
+ ## Debug
37
+
38
+ ### Web debugging
39
+
40
+ Use [@tomjs/electron-devtools-installer](https://npmjs.com/package/@tomjs/electron-devtools-installer) to install the `Chrome Devtools` plugins and use it like web development
41
+
42
+ ```ts
43
+ import { app } from 'electron';
44
+
45
+ app.whenReady().then(() => {
46
+ const { installExtension, REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS } = await import(
47
+ '@tomjs/electron-devtools-installer'
48
+ );
49
+
50
+ installExtension([REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS])
51
+ .then(exts => {
52
+ console.log(
53
+ 'Added Extension: ',
54
+ exts.map(s => s.name),
55
+ );
56
+ })
57
+ .catch(err => {
58
+ console.log('Failed to install extensions');
59
+ console.error(err);
60
+ });
61
+ });
62
+ ```
63
+
64
+ ### Main thread debugging
65
+
66
+ #### Turn on debugging
67
+
68
+ Start code compilation through the following configuration or `ELECTRON_DEBUG=1 vite dev`
69
+
70
+ - Enable by setting `APP_ELECTRON_DEBUG=1` in `.env.development` file
71
+ - `vite.config.js` configures `electron({ debug: true })` to be turned on
72
+
73
+ #### VSCODE
74
+
75
+ Run `Debug Main Process` through `vscode` to debug the main thread. For debugging tools, refer to [Official Documentation](https://code.visualstudio.com/docs/editor/debugging)
76
+
77
+ `launch.json` is configured as follows:
78
+
79
+ ```json
80
+ {
81
+ "version": "0.2.0",
82
+ "configurations": [
83
+ {
84
+ "name": "Debug Main Process",
85
+ "type": "node",
86
+ "request": "launch",
87
+ "cwd": "${workspaceFolder}",
88
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
89
+ "windows": {
90
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
91
+ },
92
+ "args": ["."],
93
+ "envFile": "${workspaceFolder}/node_modules/@tomjs/vite-plugin-electron/debug/.env"
94
+ }
95
+ ]
96
+ }
97
+ ```
98
+
34
99
  ## Reference project
35
100
 
36
101
  - [electron-vite-react](https://github.com/electron-vite/electron-vite-react)
package/template-electron-react/electron/main/index.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { release } from 'node:os';
2
2
  import { join } from 'node:path';
3
3
  import { app, BrowserWindow, ipcMain, shell } from 'electron';
4
+ import '../polyfills';
4
5
 
5
6
  const isDev = process.env.NODE_ENV === 'development';
6
7
 
@@ -22,7 +23,7 @@ process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = 'true';
22
23
 
23
24
  let win: BrowserWindow | null = null;
24
25
  // package.json "type":"module", must use mjs extension
25
- const preload = join(__dirname, '../preload/index.js');
26
+ const preload = join(__dirname, '../preload/index.mjs');
26
27
  const serverUrl = process.env.APP_DEV_SERVER_URL as string;
27
28
  const rendererDist = join(__dirname, '../renderer');
28
29
  const indexHtml = join(rendererDist, 'index.html');
package/template-electron-react/electron/polyfills.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { dirname } from 'path';
2
+ import { fileURLToPath } from 'url';
3
+
4
+ global.__dirname = dirname(fileURLToPath(import.meta.url));
package/template-electron-react/package.json CHANGED
@@ -1,6 +1,7 @@
1
1
  {
2
2
  "name": "electron-app",
3
3
  "version": "0.0.0",
4
+ "type": "module",
4
5
  "description": "vite + electron + vue",
5
6
  "engines": {
6
7
  "node": ">=18"
@@ -8,8 +9,7 @@
8
9
  "main": "dist/main/index.js",
9
10
  "scripts": {
10
11
  "dev": "vite",
11
- "build": "npm run clean && vite build && npm run release",
12
- "release": "tsx ./scripts/release.ts",
12
+ "build": "npm run clean && vite build",
13
13
  "clean": "rimraf ./dist",
14
14
  "lint": "run-s lint:eslint lint:stylelint lint:prettier",
15
15
  "lint:eslint": "eslint \"{src,electron,scripts}/**/*.{ts,tsx}\" *.{js,cjs,ts} --fix --cache",
@@ -29,11 +29,10 @@
29
29
  "@tomjs/prettier": "^1.0.6",
30
30
  "@tomjs/stylelint": "^1.1.1",
31
31
  "@tomjs/tsconfig": "^1.1.2",
32
- "@tomjs/vite-plugin-electron": "^1.3.6",
32
+ "@tomjs/vite-plugin-electron": "^1.5.0",
33
33
  "@types/node": "^18.19.3",
34
34
  "@types/react": "^18.2.43",
35
35
  "@types/react-dom": "^18.2.17",
36
- "@types/shelljs": "^0.8.15",
37
36
  "@vitejs/plugin-react-swc": "^3.5.0",
38
37
  "electron": "^28.0.0",
39
38
  "electron-builder": "^24.9.1",
@@ -43,11 +42,10 @@
43
42
  "npm-run-all": "^4.1.5",
44
43
  "prettier": "^3.1.1",
45
44
  "rimraf": "^5.0.5",
46
- "shelljs": "^0.8.5",
47
45
  "stylelint": "^15.11.0",
48
46
  "tsx": "^4.6.2",
49
47
  "typescript": "~5.2.2",
50
- "vite": "^5.0.7",
48
+ "vite": "^5.0.8",
51
49
  "vite-plugin-electron-renderer": "^0.14.5"
52
50
  }
53
51
  }
package/template-electron-react/vite.config.ts CHANGED
@@ -19,7 +19,7 @@ export default defineConfig(() => {
19
19
  },
20
20
  plugins: [
21
21
  react(),
22
- electron(),
22
+ electron({ builder: true }),
23
23
  // Use Node.js API in the Renderer process
24
24
  renderer(),
25
25
  ],
package/template-electron-vue/.vscode/launch.json CHANGED
@@ -5,16 +5,20 @@
5
5
  "version": "0.2.0",
6
6
  "configurations": [
7
7
  {
8
- "name": "Debug Main Process",
8
+ "name": "Main Debug",
9
9
  "type": "node",
10
10
  "request": "launch",
11
- "cwd": "${workspaceRoot}",
12
- "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
11
+ "cwd": "${workspaceFolder}",
12
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
13
13
  "windows": {
14
- "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd"
14
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
15
15
  },
16
- "args": ["."],
17
- "envFile": "${workspaceRoot}/node_modules/@tomjs/vite-plugin-electron/debug/.env"
16
+ "args": [
17
+ "."
18
+ ],
19
+ "envFile": "${workspaceFolder}/node_modules/@tomjs/vite-plugin-electron/debug/.env",
20
+ "outputCapture": "std",
21
+ "console": "integratedTerminal"
18
22
  },
19
23
  ]
20
24
  }
package/template-electron-vue/README.md CHANGED
@@ -8,11 +8,13 @@ vite + electron + vue
8
8
 
9
9
  ```
10
10
  |--electron
11
- | |--main
11
+ | |--main // main process code
12
12
  | | |--index.ts
13
- | |--preload
13
+ | |--preload // preload process code
14
14
  | | |--index.ts
15
- |--src
15
+ | |--build // electron-builder resources for electron package
16
+ | | |--icons
17
+ |--src // front-end code
16
18
  | |--App.vue
17
19
  | |--main.ts
18
20
  ```
@@ -31,6 +33,64 @@ vite + electron + vue
31
33
  | | |--index.html
32
34
  ```
33
35
 
36
+ ## Debug
37
+
38
+ ### Web debugging
39
+
40
+ Use [@tomjs/electron-devtools-installer](https://npmjs.com/package/@tomjs/electron-devtools-installer) to install the `Chrome Devtools` plugins and use it like web development
41
+
42
+ ```ts
43
+ import { app } from 'electron';
44
+
45
+ app.whenReady().then(() => {
46
+ const { installExtension, VUEJS_DEVTOOLS } = await import('@tomjs/electron-devtools-installer');
47
+
48
+ installExtension(VUEJS_DEVTOOLS)
49
+ .then(ext => {
50
+ console.log('Added Extension: ', ext.name);
51
+ })
52
+ .catch(err => {
53
+ console.log('Failed to install extensions');
54
+ console.error(err);
55
+ });
56
+ });
57
+ ```
58
+
59
+ ### Main thread debugging
60
+
61
+ #### Turn on debugging
62
+
63
+ Start code compilation through the following configuration or `ELECTRON_DEBUG=1 vite dev`
64
+
65
+ - Enable by setting `APP_ELECTRON_DEBUG=1` in `.env.development` file
66
+ - `vite.config.js` configures `electron({ debug: true })` to be turned on
67
+
68
+ #### VSCODE
69
+
70
+ Run `Debug Main Process` through `vscode` to debug the main thread. For debugging tools, refer to [Official Documentation](https://code.visualstudio.com/docs/editor/debugging)
71
+
72
+ `launch.json` is configured as follows:
73
+
74
+ ```json
75
+ {
76
+ "version": "0.2.0",
77
+ "configurations": [
78
+ {
79
+ "name": "Debug Main Process",
80
+ "type": "node",
81
+ "request": "launch",
82
+ "cwd": "${workspaceFolder}",
83
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
84
+ "windows": {
85
+ "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
86
+ },
87
+ "args": ["."],
88
+ "envFile": "${workspaceFolder}/node_modules/@tomjs/vite-plugin-electron/debug/.env"
89
+ }
90
+ ]
91
+ }
92
+ ```
93
+
34
94
  ## Reference project
35
95
 
36
96
  - [electron-vite-vue](https://github.com/electron-vite/electron-vite-vue)
package/template-electron-vue/electron/main/index.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { release } from 'node:os';
2
2
  import { join } from 'node:path';
3
3
  import { app, BrowserWindow, ipcMain, shell } from 'electron';
4
+ import '../polyfills';
4
5
 
5
6
  const isDev = process.env.NODE_ENV === 'development';
6
7
 
@@ -22,7 +23,7 @@ process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = 'true';
22
23
 
23
24
  let win: BrowserWindow | null = null;
24
25
  // package.json "type":"module", must use mjs extension
25
- const preload = join(__dirname, '../preload/index.js');
26
+ const preload = join(__dirname, '../preload/index.mjs');
26
27
  const serverUrl = process.env.APP_DEV_SERVER_URL as string;
27
28
  const rendererDist = join(__dirname, '../renderer');
28
29
  const indexHtml = join(rendererDist, 'index.html');
package/template-electron-vue/electron/polyfills.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { dirname } from 'path';
2
+ import { fileURLToPath } from 'url';
3
+
4
+ global.__dirname = dirname(fileURLToPath(import.meta.url));
package/template-electron-vue/package.json CHANGED
@@ -1,6 +1,7 @@
1
1
  {
2
2
  "name": "electron-app",
3
3
  "version": "0.0.0",
4
+ "type": "module",
4
5
  "description": "vite + electron + vue",
5
6
  "engines": {
6
7
  "node": ">=18"
@@ -8,8 +9,7 @@
8
9
  "main": "dist/main/index.js",
9
10
  "scripts": {
10
11
  "dev": "vite",
11
- "build": "npm run clean && vue-tsc --noEmit && vite build && npm run release",
12
- "release": "tsx ./scripts/release.ts",
12
+ "build": "npm run clean && vue-tsc --noEmit && vite build",
13
13
  "clean": "rimraf ./dist",
14
14
  "lint": "run-s lint:eslint lint:stylelint lint:prettier",
15
15
  "lint:eslint": "eslint \"{src,electron,scripts}/**/*.{js,cjs,ts,vue}\" *.{js,cjs,ts} --fix --cache",
@@ -28,9 +28,8 @@
28
28
  "@tomjs/prettier": "^1.0.6",
29
29
  "@tomjs/stylelint": "^1.1.1",
30
30
  "@tomjs/tsconfig": "^1.1.2",
31
- "@tomjs/vite-plugin-electron": "^1.3.6",
31
+ "@tomjs/vite-plugin-electron": "^1.5.0",
32
32
  "@types/node": "^18.19.3",
33
- "@types/shelljs": "^0.8.15",
34
33
  "@vitejs/plugin-vue": "^4.5.2",
35
34
  "electron": "^28.0.0",
36
35
  "electron-builder": "^24.9.1",
@@ -40,11 +39,10 @@
40
39
  "npm-run-all": "^4.1.5",
41
40
  "prettier": "^3.1.1",
42
41
  "rimraf": "^5.0.5",
43
- "shelljs": "^0.8.5",
44
42
  "stylelint": "^15.11.0",
45
43
  "tsx": "^4.6.2",
46
44
  "typescript": "~5.2.2",
47
- "vite": "^5.0.7",
45
+ "vite": "^5.0.8",
48
46
  "vite-plugin-electron-renderer": "^0.14.5",
49
47
  "vue-tsc": "^1.8.25"
50
48
  }
package/template-electron-vue/vite.config.ts CHANGED
@@ -18,7 +18,7 @@ export default defineConfig(() => {
18
18
  },
19
19
  plugins: [
20
20
  vue(),
21
- electron(),
21
+ electron({ builder: true }),
22
22
  // Use Node.js API in the Renderer process
23
23
  renderer(),
24
24
  ],
package/template-node/package.json CHANGED
@@ -65,7 +65,7 @@
65
65
  "husky": "^8.0.3",
66
66
  "jest": "^29.7.0",
67
67
  "lint-staged": "^15.2.0",
68
- "np": "^9.1.0",
68
+ "np": "^9.2.0",
69
69
  "npm-run-all": "^4.1.5",
70
70
  "prettier": "^3.1.1",
71
71
  "rimraf": "^5.0.5",
@@ -74,6 +74,6 @@
74
74
  "tsup": "^8.0.1",
75
75
  "tsx": "^4.6.2",
76
76
  "typescript": "~5.2.2",
77
- "vite": "^5.0.7"
77
+ "vite": "^5.0.8"
78
78
  }
79
79
  }
package/template-react/package.json CHANGED
@@ -38,6 +38,6 @@
38
38
  "prettier": "^3.1.1",
39
39
  "stylelint": "^15.11.0",
40
40
  "typescript": "~5.2.2",
41
- "vite": "^5.0.7"
41
+ "vite": "^5.0.8"
42
42
  }
43
43
  }
package/template-vue/package.json CHANGED
@@ -35,7 +35,7 @@
35
35
  "prettier": "^3.1.1",
36
36
  "stylelint": "^15.11.0",
37
37
  "typescript": "~5.2.2",
38
- "vite": "^5.0.7",
38
+ "vite": "^5.0.8",
39
39
  "vue-tsc": "^1.8.25"
40
40
  }
41
41
  }