搭建angular+electron项目

举报
张俭 发表于 2023/12/30 20:17:20 2023/12/30
【摘要】 install angular clinpm install -g @angular/cli create angular projectng new wolverine-angular install electronnpm install --save-dev electron@latest 书写main.jsconst { app, BrowserWindow } = require...

install angular cli

npm install -g @angular/cli

create angular project

ng new wolverine-angular

install electron

npm install --save-dev electron@latest

书写main.js

const { app, BrowserWindow } = require('electron')

const url = require("url")
const path = require("path")

let mainWindow

const winURL = `file://${__dirname}/dist/wolverine-angular/index.html`

function createWindow() {
    mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            nodeIntegration: true
        }
    })

    mainWindow.loadURL(winURL);
    mainWindow.on('closed', function () {
        mainWindow = null
    })
}
console.log(app);
app.on('ready', createWindow)

app.on('window-all-closed', function () {
    if (process.platform !== 'darwin') app.quit()
})

app.on('activate', function () {
    if (mainWindow === null) createWindow()
})

添加main和npm start

    {
      "name": "electron-app",
      "version": "0.0.0",
      "main": "main.js",
      "scripts": {
        "ng": "ng",
        "start": "ng build --base-href ./ && electron .",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e"
      }, 
      // [...]
    }

启动完成

npm start
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。