diff --git a/.env b/.env
new file mode 100644
index 0000000..d26f4c2
--- /dev/null
+++ b/.env
@@ -0,0 +1,2 @@
+# vite 服务器端口
+PORT=3344
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
index e42754a..6431ef0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,6 @@
node_modules
.DS_Store
dist
-*.local
\ No newline at end of file
+*.local
+src/main/_.js
+src/main/_.js.map
diff --git a/.yarnrc b/.yarnrc
new file mode 100644
index 0000000..a32e01d
--- /dev/null
+++ b/.yarnrc
@@ -0,0 +1 @@
+electron_mirror https://npm.taobao.org/mirrors/electron/
\ No newline at end of file
diff --git a/README.md b/README.md
index ec6393d..155ce03 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,7 @@
# electron-vue-vite
Electron、vue、vite 整合
+
+## How and Why
+- 写这个 Demo 项目主要有两个目的
+ 1. `vue@3.x` 发布了，想试试新功能
+ 2. 工作中用的 `umi`+`electron` 项目大了，启动速度并不理想；用 `vite` 试试，算一个储备方案 ^_^
diff --git a/package.json b/package.json
index 1c2a2d1..b8d3171 100644
--- a/package.json
+++ b/package.json
@@ -1,15 +1,36 @@
{
"name": "electron-vue",
- "version": "0.0.0",
+ "version": "0.0.1",
+ "main": "src/main/_.js",
+ "author": "草鞋没号 <308487730@qq.com>",
+ "license": "MIT",
"scripts": {
- "dev": "vite",
- "build": "vite build"
+ "dev": "npm run dev:all",
+ "dev:all": "concurrently -n=vue,ele -c=green,blue \"npm run vue:dev\" \"npm run ele:dev\"",
+ "vue:dev": "vite",
+ "vue:build": "vite build",
+ "ele:build": "node script/build --env=production",
+ "ele:dev": "node script/build --env=development --watch"
},
"dependencies": {
"vue": "^3.0.0-rc.1"
},
"devDependencies": {
+ "@rollup/plugin-commonjs": "^15.0.0",
+ "@rollup/plugin-node-resolve": "^9.0.0",
+ "@rollup/plugin-typescript": "^5.0.2",
+ "@vue/compiler-sfc": "^3.0.0-rc.1",
+ "chalk": "^4.1.0",
+ "concurrently": "^5.3.0",
+ "dotenv": "^8.2.0",
+ "electron": "9.1.0",
+ "electron-builder": "^22.8.0",
+ "electron-connect": "^0.6.3",
+ "electron-is-dev": "^1.2.0",
+ "minimist": "^1.2.5",
+ "ora": "^5.0.0",
+ "typescript": "^3.9.7",
"vite": "^1.0.0-rc.1",
- "@vue/compiler-sfc": "^3.0.0-rc.1"
+ "wait-on": "^5.2.0"
}
-}
\ No newline at end of file
+}
diff --git a/screenshot/cmd.png b/screenshot/cmd.png
new file mode 100644
index 0000000..9ccecfa
Binary files /dev/null and b/screenshot/cmd.png differ
diff --git a/screenshot/main-black.png b/screenshot/main-black.png
new file mode 100644
index 0000000..9467d03
Binary files /dev/null and b/screenshot/main-black.png differ
diff --git a/screenshot/main-white.png b/screenshot/main-white.png
new file mode 100644
index 0000000..ed947b7
Binary files /dev/null and b/screenshot/main-white.png differ
diff --git a/script/build.js b/script/build.js
new file mode 100644
index 0000000..e54c646
--- /dev/null
+++ b/script/build.js
@@ -0,0 +1,53 @@
+/**
+ * electron 打包
+ */
+const path = require('path');
+const rollup = require('rollup');
+const argv = require('minimist')(process.argv.slice(2));
+const chalk = require('chalk');
+const ora = require('ora');
+const waitOn = require('wait-on');
+const electron = require('electron-connect').server.create({ stopOnClose: true });
+require('dotenv').config({ path: path.join(__dirname, '../.env') })
+const options = require('./rollup.config');
+
+const opt = options(argv.env);
+const TAG = '[script/build.js]';
+const spinner = ora(`${TAG} Electron build...`);
+
+if (argv.watch) {
+ waitOn({
+ resources: [`http://localhost:${process.env.PORT}`],
+ log: false,
+ }, err => {
+ if (err) {
+ console.log(err);
+ process.exit(1);
+ }
+
+ // once here, all resources are available
+ const watcher = rollup.watch(opt);
+ watcher.on('change', filename => {
+ const log = chalk.green(`change -- ${filename}`);
+ console.log(TAG, log);
+ });
+ watcher.on('event', ev => {
+ if (ev.code === 'END') {
+ // init-未启动、started-第一次启动、restarted-重新启动
+ electron.electronState === 'init' ? electron.start() : electron.restart();
+ }
+ });
+ });
+} else {
+ spinner.start();
+ rollup.rollup(opt)
+ .then(build => {
+ spinner.stop();
+ console.log(TAG, chalk.green('Electron build successed.'));
+ build.write(opt.output);
+ })
+ .catch(error => {
+ spinner.stop();
+ console.log(`\n${TAG} ${chalk.red('构建报错')}\n`, error, '\n');
+ });
+}
diff --git a/script/rollup.config.js b/script/rollup.config.js
new file mode 100644
index 0000000..1cdbb67
--- /dev/null
+++ b/script/rollup.config.js
@@ -0,0 +1,27 @@
+const path = require('path');
+const { nodeResolve } = require('@rollup/plugin-node-resolve');
+const commonjs = require('@rollup/plugin-commonjs');
+const typescript = require('@rollup/plugin-typescript');
+
+module.exports = (env = 'production') => {
+ return {
+ input: path.join(__dirname, '../src/main/index.ts'),
+ output: {
+ file: path.join(__dirname, '../src/main/_.js'),
+ format: 'cjs',
+ name: 'ElectronMainBundle',
+ sourcemap: true,
+ },
+ plugins: [
+ nodeResolve({ jsnext: true, preferBuiltins: true, browser: true }), // 消除碰到 node.js 模块时⚠警告
+ commonjs(),
+ typescript(),
+ ],
+ external: [
+ 'fs',
+ 'path',
+ 'electron',
+ 'electron-is-dev',
+ ],
+ }
+};
diff --git a/src/App.vue b/src/App.vue
deleted file mode 100644
index aa1197b..0000000
--- a/src/App.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-
- 
-
-
-
-
diff --git a/src/main/index.ts b/src/main/index.ts
new file mode 100644
index 0000000..aafad94
--- /dev/null
+++ b/src/main/index.ts
@@ -0,0 +1,27 @@
+/**
+ * electron 主文件
+ */
+import { join } from 'path'
+import { app, BrowserWindow } from 'electron'
+import is_dev from 'electron-is-dev'
+import dotenv from 'dotenv'
+
+dotenv.config({ path: join(__dirname, '../../.env') })
+
+let win = null
+
+function createWin() {
+ // 创建浏览器窗口
+ win = new BrowserWindow({
+ width: 1024,
+ height: 768,
+ })
+
+ const URL = is_dev
+ ? `http://localhost:${process.env.PORT}` // vite 启动的服务器地址
+ : `file://${join(__dirname, '../render/dist/index.html')}` // vite 构建后的静态文件地址
+
+ win.loadURL(URL)
+}
+
+app.whenReady().then(createWin)
diff --git a/src/render/App.vue b/src/render/App.vue
new file mode 100644
index 0000000..be70e71
--- /dev/null
+++ b/src/render/App.vue
@@ -0,0 +1,26 @@
+
+
+
+
+