refactor: build with console.log electron

package.json

@@ -1,7 +1,7 @@
 {
   "name": "electron-vue",
   "version": "0.0.1",
-  "main": "dist/main/_.js",
+  "main": "dist/main/index.js",
   "author": "草鞋没号 <308487730@qq.com>",
   "license": "MIT",
   "scripts": {
@@ -56,9 +56,10 @@
   },
   "devDependencies": {
     "@rollup/plugin-alias": "^3.1.2",
-    "@rollup/plugin-commonjs": "^18.0.0",
+    "@rollup/plugin-commonjs": "^19.0.0",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^11.2.1",
+    "@rollup/plugin-typescript": "^8.2.1",
     "@types/minimist": "^1.2.1",
     "@vitejs/plugin-vue": "^1.2.2",
     "@vue/compiler-sfc": "^3.0.11",

script/.rollup.config.esbuild.ts

@@ -0,0 +1,60 @@
+import { join } from 'path'
+import { RollupOptions } from 'rollup'
+import { nodeResolve } from '@rollup/plugin-node-resolve'
+import commonjs from '@rollup/plugin-commonjs'
+import esbuild from 'rollup-plugin-esbuild'
+import alias from '@rollup/plugin-alias'
+import json from '@rollup/plugin-json'
+import { builtins } from './utils'
+
+export default (env = 'production') => {
+  const options: RollupOptions = {
+    input: join(__dirname, '../src/main/index.ts'),
+    output: {
+      file: join(__dirname, '../dist/main/_.js'),
+      format: 'cjs',
+      name: 'ElectronMainBundle',
+      sourcemap: true,
+    },
+    plugins: [
+      nodeResolve({ preferBuiltins: true, browser: true }), // 消除碰到 node.js 模块时⚠警告
+      commonjs(),
+      json(),
+      esbuild({
+        // All options are optional
+        include: /\.[jt]sx?$/, // default, inferred from `loaders` option
+        exclude: /node_modules/, // default
+        // watch: process.argv.includes('--watch'), // rollup 中有配置
+        sourceMap: false, // default
+        minify: env === 'production',
+        target: 'es2017', // default, or 'es20XX', 'esnext'
+        jsxFactory: 'React.createElement',
+        jsxFragment: 'React.Fragment',
+        // Like @rollup/plugin-replace
+        define: {
+          __VERSION__: '"x.y.z"'
+        },
+        tsconfig: 'tsconfig.json', // default
+        // Add extra loaders
+        loaders: {
+          // Add .json files support
+          // require @rollup/plugin-commonjs
+          '.json': 'json',
+          // Enable JSX in .js files too
+          '.js': 'jsx'
+        },
+      }),
+      alias({
+        entries: [
+          { find: '@main', replacement: join(__dirname, '../src/main'), },
+        ]
+      }),
+    ],
+    external: [
+      ...builtins(),
+      'electron',
+    ],
+  }
+
+  return options
+}

script/build-main.ts

@@ -16,13 +16,13 @@ import { main } from '../package.json'
 dotenv.config({ path: join(__dirname, '../.env') })
 
 const argv = minimist(process.argv.slice(2))
-const opt = options(argv.env)
+const opts = options(argv.env)
 const TAG = '[build-main.ts]'
 const spinner = ora(`${TAG} Electron build...`)
 
 if (argv.watch) {
   waitOn({ port: process.env.PORT as string }).then(msg => {
-    const watcher = watch(opt)
+    const watcher = watch(opts)
     let child: ChildProcess
     watcher.on('change', filename => {
       const log = chalk.green(`change -- ${filename}`)
@@ -39,11 +39,11 @@ if (argv.watch) {
   })
 } else {
   spinner.start()
-  rollup(opt)
+  rollup(opts)
     .then(build => {
       spinner.stop()
       console.log(TAG, chalk.green('Electron build successed.'))
-      build.write(opt.output as OutputOptions)
+      build.write(opts.output as OutputOptions)
     })
     .catch(error => {
       spinner.stop()

script/rollup.config.ts

@@ -1,8 +1,8 @@
 import { join } from 'path'
 import { RollupOptions } from 'rollup'
-import { nodeResolve } from '@rollup/plugin-node-resolve'
+import nodeResolve from '@rollup/plugin-node-resolve'
 import commonjs from '@rollup/plugin-commonjs'
-import esbuild from 'rollup-plugin-esbuild'
+import typescript from '@rollup/plugin-typescript'
 import alias from '@rollup/plugin-alias'
 import json from '@rollup/plugin-json'
 import { builtins } from './utils'
@@ -11,42 +11,22 @@ export default (env = 'production') => {
   const options: RollupOptions = {
     input: join(__dirname, '../src/main/index.ts'),
     output: {
-      file: join(__dirname, '../dist/main/_.js'),
+      file: join(__dirname, '../dist/main/index.js'),
       format: 'cjs',
       name: 'ElectronMainBundle',
       sourcemap: true,
     },
     plugins: [
-      nodeResolve({ preferBuiltins: true, browser: true }), // 消除碰到 node.js 模块时⚠警告
+      nodeResolve(),
       commonjs(),
       json(),
-      esbuild({
+      typescript({
-        // All options are optional
+        module: 'ESNext',
-        include: /\.[jt]sx?$/, // default, inferred from `loaders` option
-        exclude: /node_modules/, // default
-        // watch: process.argv.includes('--watch'), // rollup 中有配置
-        sourceMap: false, // default
-        minify: env === 'production',
-        target: 'es2017', // default, or 'es20XX', 'esnext'
-        jsxFactory: 'React.createElement',
-        jsxFragment: 'React.Fragment',
-        // Like @rollup/plugin-replace
-        define: {
-          __VERSION__: '"x.y.z"'
-        },
-        tsconfig: 'tsconfig.json', // default
-        // Add extra loaders
-        loaders: {
-          // Add .json files support
-          // require @rollup/plugin-commonjs
-          '.json': 'json',
-          // Enable JSX in .js files too
-          '.js': 'jsx'
-        },
       }),
       alias({
         entries: [
           { find: '@main', replacement: join(__dirname, '../src/main'), },
+          { find: '@root', replacement: join(__dirname, '..'), },
         ]
       }),
     ],

src/render/main.ts

@@ -1,9 +1,12 @@
 import { createApp } from 'vue'
 import App from './App.vue'
-// vite 会编译 import 的形式；所以 electron 及 node.js 内置模块用 require 形式
+import { ipcRenderer } from 'electron'
-const { ipcRenderer } = require('electron')
+// import Store from 'electron-store'
 import './index.css'
 
 console.log('ipcRenderer:', ipcRenderer)
+// console.log('electron-store', new Store({ name: 'electron-vue' }))
 
-createApp(App).mount('#app').$nextTick(window.ClosePreloadLoading)
+createApp(App)
+  .mount('#app')
+  .$nextTick(window.ClosePreloadLoading)

tsconfig.json

@@ -12,6 +12,7 @@
     "strict": true,
     "paths": {
       "@/*": ["src/render/*"],
+      "@main/*": ["src/main/*"],
       "@root/*": ["./*"]
     },
     "allowSyntheticDefaultImports": true

vite.config.ts

@@ -3,6 +3,7 @@ require('dotenv').config({ path: join(__dirname, '.env') })
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import { join } from 'path'
+import typescript from '@rollup/plugin-typescript'
 import { builtins } from './script/utils'
 
 // https://vitejs.dev/config/
@@ -23,9 +24,19 @@ export default defineConfig({
     outDir: join(__dirname, 'dist/render'),
     emptyOutDir: true,
     minify: false,
-    commonjsOptions: {},
+    commonjsOptions: {
+      dynamicRequireTargets: [
+        join(__dirname, 'package.json'),
+      ],
+    },
     assetsDir: '', // 相对路径 加载问题
+    sourcemap: true,
     rollupOptions: {
+      plugins: [
+        // typescript({
+        //   module: 'ESNext',
+        // }),
+      ],
       external: [
         ...builtins(),
         'electron',

yarn.lock

@@ -105,10 +105,10 @@
   dependencies:
     slash "^3.0.0"
 
-"@rollup/plugin-commonjs@^18.0.0":
+"@rollup/plugin-commonjs@^19.0.0":
-  version "18.0.0"
+  version "19.0.0"
-  resolved "https://registry.yarnpkg.com/@rollup/plugin-commonjs/-/plugin-commonjs-18.0.0.tgz#50dc7518b5aa9e66a270e529ea85115d269825c4"
+  resolved "https://registry.yarnpkg.com/@rollup/plugin-commonjs/-/plugin-commonjs-19.0.0.tgz#8c3e71f9a66908e60d70cc1be205834ef3e45f71"
-  integrity sha512-fj92shhg8luw7XbA0HowAqz90oo7qtLGwqTKbyZ8pmOyH8ui5e+u0wPEgeHLH3djcVma6gUCUrjY6w5R2o1u6g==
+  integrity sha512-adTpD6ATGbehdaQoZQ6ipDFhdjqsTgpOAhFiPwl+dzre4pPshsecptDPyEFb61JMJ1+mGljktaC4jI8ARMSNyw==
   dependencies:
     "@rollup/pluginutils" "^3.1.0"
     commondir "^1.0.1"
@@ -137,6 +137,14 @@
     is-module "^1.0.0"
     resolve "^1.19.0"
 
+"@rollup/plugin-typescript@^8.2.1":
+  version "8.2.1"
+  resolved "https://registry.yarnpkg.com/@rollup/plugin-typescript/-/plugin-typescript-8.2.1.tgz#f1a32d4030cc83432ce36a80a922280f0f0b5d44"
+  integrity sha512-Qd2E1pleDR4bwyFxqbjt4eJf+wB0UKVMLc7/BAFDGVdAXQMCsD4DUv5/7/ww47BZCYxWtJqe1Lo0KVNswBJlRw==
+  dependencies:
+    "@rollup/pluginutils" "^3.1.0"
+    resolve "^1.17.0"
+
 "@rollup/pluginutils@^3.0.8", "@rollup/pluginutils@^3.1.0":
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-3.1.0.tgz#706b4524ee6dc8b103b3c995533e5ad680c02b9b"
@@ -177,9 +185,9 @@
   integrity sha512-Q1y515GcOdTHgagaVFhHnIFQ38ygs/kmxdNpvpou+raI9UO3YZcHDngBSYKQklcKlvA7iuQlmIKbzvmxcOE9CQ==
 
 "@types/estree@*":
-  version "0.0.45"
+  version "0.0.47"
-  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.45.tgz#e9387572998e5ecdac221950dab3e8c3b16af884"
+  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.47.tgz#d7a51db20f0650efec24cd04994f523d93172ed4"
-  integrity sha512-jnqIUKDUqJbDIUxm0Uj7bnlMnRm1T/eZ9N+AVMqhPgzrba2GhGG5o/jCTwmdPK709nEZsGoMzXEDUjcXHa3W0g==
+  integrity sha512-c5ciR06jK8u9BstrmJyO97m+klJrrhCf9u3rLu3DEAJBirxRqSCvDQoYKmxuYwQI5SZChAWu+tq9oVlGRuzPAg==
 
 "@types/estree@0.0.39":
   version "0.0.39"
@@ -628,9 +636,9 @@ builder-util@22.10.5:
     temp-file "^3.3.7"
 
 builtin-modules@^3.1.0:
-  version "3.1.0"
+  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-3.1.0.tgz#aad97c15131eb76b65b50ef208e7584cd76a7484"
+  resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-3.2.0.tgz#45d5db99e7ee5e6bc4f362e008bf917ab5049887"
-  integrity sha512-k0KL0aWZuBt2lrxrcASWDfwOLMnodeQjodT/1SxEQAXsHANgo6ZC/VEaSEHCXt7aSTZ4/4H5LKa+tBXmW7Vtvw==
+  integrity sha512-lGzLKcioL90C7wMczpkY0n/oART3MbBa8R9OFGE1rJxoVI86u4WAGfEk8Wjv10eKSyTHVGkSo3bvBylCEtk7LA==
 
 cacheable-request@^6.0.0:
   version "6.1.0"