From 775c0cfffd48f31a620423ba8ff8f2ff843671ef Mon Sep 17 00:00:00 2001 From: xunjijiang <329453626x@gmail.com> Date: Wed, 26 Jun 2024 14:29:05 +0800 Subject: [PATCH] fix: resolve Build app does not load properly npm run build #29 The reason why the initial application cannot be built now may be as follows: (1)remove [workspace-path]\dist-app\win-unpacked\d3dcompiler_47.dll: Access is denied. This is because the file is occupied by [workspace-path]\dist-app\win-unpacked\[app].exe. Just restart the computer or use other methods to unblock it. (2)C:\Users\[user name]\AppData\Local\electron-builder\Cache\nsis\nsis-3.0.4.1\Bin\makensis.exe process failed ERR_ELECTRON_BUILDER_CANNOT_EXECUTE Exit code: 1 When this error occurs, the application has completed packaging, but the installation package failed to be packaged. This problem occurs when using pnpm, but there is no problem using npm. After installing Electron-build globally, enter the dist folder and run Electron-build to solve the problem. (3)Application entry file "main.js" in the "[workspace-path]\dist-app\win-unpacked\resources\app.asar" does not exist. Seems like a wrong configuration. This is because the copy plug-in does not correctly put main.js and preload.mjs into the dist folder. Run npm run build again to solve the problem --- electron/main.ts | 2 +- electron/package.json | 3 ++- src/index.ts | 44 +++++++++++++++++++++++++++++++++++++++++-- 3 files changed, 45 insertions(+), 4 deletions(-) diff --git a/electron/main.ts b/electron/main.ts index d91913a..d0d1c88 100644 --- a/electron/main.ts +++ b/electron/main.ts @@ -43,7 +43,7 @@ function createWindow() { win.loadURL(VITE_DEV_SERVER_URL) } else { // win.loadFile('dist/index.html') - win.loadFile(path.join(RENDERER_DIST, 'index.html')) + win.loadFile('index.html') } } diff --git a/electron/package.json b/electron/package.json index c364aa3..bc26651 100644 --- a/electron/package.json +++ b/electron/package.json @@ -3,6 +3,7 @@ "electron": "^30.0.1", "electron-builder": "^24.13.3", "vite-plugin-electron": "^0.28.6", - "vite-plugin-electron-renderer": "^0.14.5" + "vite-plugin-electron-renderer": "^0.14.5", + "vite-plugin-static-copy": "^1.0.5" } } diff --git a/src/index.ts b/src/index.ts index 507eeb2..6c8b712 100644 --- a/src/index.ts +++ b/src/index.ts @@ -260,13 +260,21 @@ function setupElectron(root: string, framework: Framework) { // package.json editFile(path.join(root, 'package.json'), content => { + const pkgInfo = pkgFromUserAgent(process.env.npm_config_user_agent) + const pkgManager = pkgInfo ? pkgInfo.name : 'npm' const json = JSON.parse(content) json.main = 'dist-electron/main.js' - json.scripts.build = `${json.scripts.build} && electron-builder` + json.scripts.build = `${json.scripts.build} && cd dist && ${pkgManager} i && electron-builder` json.devDependencies.electron = pkg.devDependencies.electron json.devDependencies['electron-builder'] = pkg.devDependencies['electron-builder'] json.devDependencies['vite-plugin-electron'] = pkg.devDependencies['vite-plugin-electron'] json.devDependencies['vite-plugin-electron-renderer'] = pkg.devDependencies['vite-plugin-electron-renderer'] + json.devDependencies['vite-plugin-static-copy'] = pkg.devDependencies['vite-plugin-static-copy'] + json.build = { + directories: { + output: 'dist-app', + }, + } return JSON.stringify(json, null, 2) + '\n' }) @@ -309,6 +317,34 @@ window.ipcRenderer.on('main-process-message', (_event, message) => { ? undefined : {}, })` + const copyPlugin = `copy({ + targets: [ + { + src: 'package.json', + dest: '', + transform(contents) { + const json = JSON.parse(contents.toString()); + json.main = 'main.js'; + delete json.scripts; + const ev = json.devDependencies.electron; + delete json.dependencies; + json.devDependencies = { + electron: ev, + }; + json.build.directories.output = path.join('..', json.build.directories.output ?? 'dist-app'); + return JSON.stringify(json, null, 2); + }, + }, + { + src: 'dist-electron/main.js', + dest: '', + }, + { + src: 'dist-electron/preload.mjs', + dest: '', + }, + ], + })` if (framework === 'vue' || framework === 'react') { editFile(path.join(root, 'vite.config.ts'), content => content @@ -316,12 +352,14 @@ window.ipcRenderer.on('main-process-message', (_event, message) => { .map(line => line.includes("import { defineConfig } from 'vite'") ? `${line} import path from 'node:path' -import electron from 'vite-plugin-electron/simple'` +import electron from 'vite-plugin-electron/simple' +import { viteStaticCopy as copy } from 'vite-plugin-static-copy'` : line) .map(line => line.trimStart().startsWith('plugins') ? ` plugins: [ ${framework}(), ${electronPlugin}, + ${copyPlugin}, ],` : line) .join('\n') @@ -333,11 +371,13 @@ import electron from 'vite-plugin-electron/simple'` import { defineConfig } from 'vite' import path from 'node:path' import electron from 'vite-plugin-electron/simple' +import { viteStaticCopy as copy } from 'vite-plugin-static-copy' // https://vitejs.dev/config/ export default defineConfig({ plugins: [ ${electronPlugin}, + ${copyPlugin}, ], }) `.trimStart()