Giter Club home page Giter Club logo

fast-vite-nestjs-electron's Introduction

logo

⚡Vite + Electron + Nestjs Template

This template is used to build vite + electron + nestjs projects. Build with Doubleshot, crazy fast!

🎉 Doubleshot is a whole new set of tools to help you quickly build and start a node backend or electron main process.

This is a vue version of the template, you can also use:

Introduce

This is a template based on my repo: fast-vite-electron. In the main process, I integrated nestjs. In the main process, you can build your code just as you would write a nestjs backend. Desktop clients built from this template can quickly split the electron when you need to switch to B/S.

Features

How to use

  • Click the Use this template button (you must be logged in) or just clone this repo.

  • In the project folder:

    # install dependencies
    yarn # npm install
    
    # run in developer mode
    yarn dev # npm run dev
    
    # build
    yarn build # npm run build

Note for PNPM

In order to use with pnpm, you'll need to adjust your .npmrc to use any one the following approaches in order for your dependencies to be bundled correctly (ref: #6389):

node-linker=hoisted
public-hoist-pattern=*
shamefully-hoist=true

Relative

My blog post:

fast-vite-nestjs-electron's People

Contributors

archergu avatar dependabot[bot] avatar renovate[bot] avatar sunsettechuila avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

fast-vite-nestjs-electron's Issues

mac

请问一下这个是否可以完成打包mac可安装程序

How to build for Windows using react in render?

Hello, I'm trying to use your project with render in react, the construction and development is 100% but I'm having difficulty building it, it builds electron but it's not adding the render, could you help me?

electron 内调用其他进程,会导致窗口无法正常关闭

请查看示例:edwinhuish/fast-vite-nestjs-electron

代码修改部分:

代码里进加入了 playwright,并通过ipc通讯,调用playwright 打开 chromium。

运行环境

  • Win10 + WSL2 + WSLG

复现步骤:

  • clone 代码库到本地
  • 安装依赖
  • pnpm run dev / pnpm run build 并启动 AppImage
  • 点击启动后的窗口里的 open chromium 按钮
  • 尝试关闭主程序。 无论是chromium是否已关闭,electron 的主窗口的关闭已经失效。

具体问题

  • 开发模式下, 关闭按钮直接失效,同时窗口点击无效。
  • 打包成 AppImage 后,关闭按钮点击一次关闭第一个 chromium,并弹出一个新的 BrowserWindow。 点击关闭第二个 BrowserWindow 的关闭按钮关闭第二个 chromium 。。。 以此类推。。
  • 无论开发环境还是打包好的 AppImage,只要打开过chromium,无论后面有没有手动关闭 chromium,问题依旧。

其他库执行相同操作

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

This repository currently has no open or pending branches.

Detected dependencies

github-actions
.github/workflows/ci.yml
  • actions/checkout v4@692973e3d937129bcbf40652eb9f2f61becf3332
  • pnpm/action-setup v4.0.0
  • actions/setup-node v4
  • actions/checkout v4@692973e3d937129bcbf40652eb9f2f61becf3332
  • pnpm/action-setup v4.0.0
  • actions/setup-node v4
npm
package.json
  • @doubleshot/nest-electron ^0.2.5
  • @nestjs/common ^10.3.8
  • @nestjs/core ^10.3.8
  • @nestjs/microservices ^10.3.8
  • reflect-metadata ^0.2.2
  • rxjs ^7.8.1
  • vue ^3.4.27
  • @lightwing/eslint-config ^1.0.52
  • @vitejs/plugin-vue 5.0.5
  • @vue/compiler-sfc 3.4.31
  • electron 31.2.1
  • electron-builder 24.13.3
  • eslint 9.7.0
  • lint-staged 15.2.7
  • rimraf 6.0.1
  • simple-git-hooks 2.11.1
  • typescript 5.5.3
  • vite 5.3.3
  • vite-plugin-doubleshot 0.0.16
  • vue-tsc 2.0.26
  • pnpm 9.5.0

  • Check this box to trigger a request for Renovate to run again on this repository

contextisolation和require冲突怎么解决呀

微信截图_20220722124609

webPreferences: {
nodeIntegration: true,
contextIsolation: true,
preload: join(__dirname, '../preload/index.js'),
devTools: isDev
}
contextIsolation设为true
开发版本:界面正常,可调用IPC方法,但不用使用require方法
发布版本:界面空白

contextIsolation设为false
开发版本:界面正常,不可调用IPC方法
发布版本:界面正常,不可调用IPC方法

请问怎么解决这个问题呀

添加了TypeOrm后,服务注入报错

微信截图_20220718193107

服务层添加“ constructor(@InjectRepository(CWell) private readonly repository:Repository ){}”就报错,移出就正常,提示让安装“pg-native”,但pg-native的安装,需要更多的工具,确认不支持TypeOrm嘛?

image

How to pass arguments to electron builder

Hi, please I can't find how to pass arguments to electron builder
example: pnpm run build --windows nsis:x64

At the moment Vite is throwing an error

          throw new CACError(`Unknown option \`${name.length > 1 ? `--${name}` : `-${name}`}\``);
                ^

CACError: Unknown option `--windows`
    at Command.checkUnknownOptions (fi

No handler registered for 'msg'

Q:

Using your side of the wrapper library, set up ipc communication failed to register Handle

Log:

Error occurred in handler for 'msg': Error: No handler registered for 'msg'
    at WebContents.<anonymous> (node:electron/js2c/browser_init:2:82920)
    at WebContents.emit (node:events:518:28)
    at WebContents.callbackTrampoline (node:internal/async_hooks:130:17)

静态资源配置

nest的静态资源如何处理?比如yaml文件,nestjs中使用nest-cli.json文件配合webpack来生成,您这个项目用的vite构建,我不知道如何设置。能指导一下吗?谢谢。

请教一个关于微服务的问题

我需要在fast-vite-nestjs-electron项目中,使用nestjs的微服务功能,请问如何配置vite及其他配置文件,来做到能同时编译所有经过nest g app app-name命令创建的微服务,并且软件打开时,所有服务同时启动?

打包后无法运行

兄弟,我又来打扰你了😁😁😁
我的项目在开发模式下运行没什么问题,但是打包后就无法执行了,也不报错,这是啥原因?

引入 sqlite3 报错问题

你好, 项目中安装 sqlit3 插件, 再 app.controller.ts 中的顶部引入 const sqlite3 = require("sqlite3").verbose(); 进行使用.

发现有报错

[main] App threw an error during load
[main] Error: package.json does not exist at /Users/liu/project/fast-vite-nestjs-electron/dist/package.json
[main] at Object.exports2.find (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:10682:15)
[main] at node_modules/sqlite3/lib/sqlite3-binding.js (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:10901:31)
[main] at __require2 (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:16:44)
[main] at node_modules/sqlite3/lib/sqlite3.js (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:10951:19)
[main] at __require2 (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:16:44)
[main] at src/main/app.controller.ts (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:11156:19)
[main] at __require2 (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:16:44)
[main] at src/main/app.module.ts (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:11351:28)
[main] at __require2 (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:16:44)
[main] at Object. (/Users/liu/project/fast-vite-nestjs-electron/dist/main/index.js:11371:29)
image

我看了打包过后的文件, 发现 这个包引入了package.json
image

但是我不知道如何解决, 您可以帮忙看看么?🙏🙏🙏

下载编译canvas失败

项目中需要用到node-canvas库,按照官网以及googole上面各种教程尝试后,都无法成功,能帮忙看看什么原因吗?

warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
error D:\project\software\Department\pdfReset\node_modules\canvas: Command failed.
Exit code: 6
Command: node-pre-gyp install --fallback-to-build
Arguments:
Directory: D:\project\software\Department\pdfReset\node_modules\canvas
Output:
node-pre-gyp info it worked if it ends with ok
node-pre-gyp info using [email protected]
node-pre-gyp info using [email protected] | win32 | x64
node-pre-gyp info check checked for "D:\project\software\Department\pdfReset\node_modules\canvas\build\Release\canvas.node" (not found)
node-pre-gyp http GET https://github.com/Automattic/node-canvas/releases/download/v2.9.1/canvas-v2.9.1-node-v93-win32-unknown-x64.tar.gz
node-pre-gyp info install unpacking Release/
node-pre-gyp info install unpacking Release/canvas.exp
node-pre-gyp info install unpacking Release/canvas.ilk
node-pre-gyp info install unpacking Release/canvas.lib
node-pre-gyp info install unpacking Release/canvas.node
node-pre-gyp info install unpacking Release/canvas.pdb
node-pre-gyp ERR! Completion callback never invoked!
node-pre-gyp ERR! System Windows_NT 10.0.22000
node-pre-gyp ERR! command "D:\ProgramFiles\nodejs\node.exe" "D:\project\software\Department\pdfReset\node_modules\@mapbox\node-pre-gyp\bin\node-pre-gyp" "install" "--fallback-to-build"
node-pre-gyp ERR! cwd D:\project\software\Department\pdfReset\node_modules\canvas
node-pre-gyp ERR! node -v v16.14.2
node-pre-gyp ERR! node-pre-gyp -v v1.0.9
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.

建议:加入nest-cli.json配置

{
"collection": "@nestjs/schematics",
"sourceRoot": "main/src"
}
我在项目中加入了nest-cli.json文件,配置如上,这样可以使用nest-cli命令来生成对应的模块,不过我尝试使用nest new app的时候,依然报错了,希望可以增加对nest-cli的支持就更棒了。

内存溢出

Maximum call stack size exceeded

再对数据进行处理的时候,爆了这个错
我可以确定不是循环引用的原因
是因为数据量太大了.
那么我可以通过增加 node 的内存来做么?
如何增加 node 的内存 需要怎么添加呢?

how to load page after app packed

dear ArcherGu @ArcherGu
if the app starts with more than one window, how to set loadUrl's params?
e.g
window A
const URL = isDev ? process.env.DS_RENDERER_URL :file://${join(app.getAppPath(), 'dist/render/index.html)}

windowB
const URL = isDev ?${process.env.DS_RENDERER_URL}/#/windowB:file://${join(app.getAppPath(), 'dist/render/index.html/ ? ')}
wrong method:
file://${join(app.getAppPath(), 'dist/render/index.html/#/windowB')}

thanks!

Building gives a build without node process

This also happens on template, you clone it then yarn, yarn build then execute the mac image from dist or on windows
Screenshot 2023-09-27 at 10 38 29
But it doesnt regonizes anything node/nestjs related

适用场景求助

最初需求

跨平台的web应用能力扩展工具:

  • 系统级的通知消息
  • 本地文件监听与读写等

技术选型

终端安装本地web服务供浏览器页面调用扩展能力:

  • express用于实现服务,后来引入nest 也不算复杂, 主要借用其模块划分及文件组织方式
  • 系统级通知及窗口集成electron,兼容性好:考虑封装成一个模块,提供createWindow等方法供express路由或后端定时器使用,为页面注入与主进程通信的相关方法
  • 发布方式:不同操作系统提供不同的node_modules,以源码方式发布, 升级时下载对应模块或全部源码即可

遇到问题

基于 https://github.com/electron/electron-quick-start 实现了逻辑, 但发现以electron .或node ./node_modules/electron/cli.js . 可以正常运行,直接node main.js 就会提示app.*的方法TypeError: Cannot read properties of undefined (reading 'on')

通过搜索nest electron发现了这个项目,看上去刚好就是我需要的,但感觉学习曲线略有陡峭,在深入之前想咨询了解一下,还望不吝赐教:

  • 看上去Doubleshot 就可以满足我的需要了: 封装后台使用的electron能力
  • 是否还支持nest start的方式?
  • vite没太用过,yarn build # npm run build会生成什么?发布时如何使用?是否能很方便的制作跨平台的包,还是每个操作系统各自生成?

所以fast-vite-nestjs-electron是否适合我的需求,可以继续深入研究?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.