升级到角度 16 后的电子问题

Problem with electron after upgrading to angular 16

提问人:dany allaw 提问时间:10/30/2023 最后编辑:dany allaw 更新时间:10/30/2023 访问量:82

问:

在我将 angular 库升级到 v16 后,我收到此错误。

./node_modules/electron/index.js:1:11-24 - Error: Module not found: Error: Can't resolve 'fs' in 'D:\MxTime\MxTimeLatest\node_modules\electron'

./node_modules/electron/index.js:2:13-28 - Error: Module not found: Error: Can't resolve 'path' in 'D:\MxTime\MxTimeLatest\node_modules\electron'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
        - install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "path": false }

经过一番挖掘,我想我需要向 webpack 配置文件添加一些配置,不幸的是我没有 webpack 配置文件,webpack 是一个由另一个库下载的包,在我的情况下是“@angular-devkit/build-angular”。

我试着添加 浏览器 : { “os” : false , “path” : false , “fs” : false } 到我的package.json文件中,构建有效,但应用程序没有启动,我想因为我确实需要那些电子变量,

上面提到的 /electron 下的索引.js 是这样的:

const fs = require('fs');
const path = require('path');

const pathFile = path.join(__dirname, 'path.txt');

function getElectronPath () {
  let executablePath;
  if (fs.existsSync(pathFile)) {
    executablePath = fs.readFileSync(pathFile, 'utf-8');
  }
  if (process.env.ELECTRON_OVERRIDE_DIST_PATH) {
    return path.join(process.env.ELECTRON_OVERRIDE_DIST_PATH, executablePath || 'electron');
  }
  if (executablePath) {
    return path.join(__dirname, 'dist', executablePath);
  } else {
    throw new Error('Electron failed to install correctly, please delete node_modules/electron and try installing again');
  }
}

module.exports = getElectronPath();

package.json以备不时之需

    {
  "name": "app name ",
  "version": "1.4.6",
  "main": "main.js",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "update": "ng update",
    "electron": "electron .",
    "dev": "nodemon --watch . --exec electron . --debug"
  },
  "build": {
    "appId": "some app Id"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^16.0.0",
    "@angular/cdk": "^16.0.0",
    "@angular/common": "^16.0.0",
    "@angular/compiler": "^16.0.0",
    "@angular/core": "^16.0.0",
    "@angular/forms": "^16.0.0",
    "@angular/localize": "^16.0.0",
    "@angular/material": "^16.0.0",
    "@angular/platform-browser": "^16.0.0",
    "@angular/platform-browser-dynamic": "^16.0.0",
    "@angular/router": "^16.0.0",
    "@fortawesome/fontawesome-free": "^6.4.2",
    "@fullcalendar/angular": "^6.1.8",
    "@fullcalendar/bootstrap": "^6.1.8",
    "@fullcalendar/core": "^6.1.8",
    "@fullcalendar/daygrid": "^6.1.8",
    "@fullcalendar/interaction": "^6.1.8",
    "@fullcalendar/list": "^6.1.8",
    "@fullcalendar/timegrid": "^6.1.8",
    "@microsoft/microsoft-graph-client": "^3.0.7",
    "@ng-bootstrap/ng-bootstrap": "^15.1.2",
    "@ng-select/ng-select": "^11.2.0",
    "@popperjs/core": "^2.11.6",
    "@types/jquery": "^3.5.25",
    "angular-font-awesome": "^3.1.2",
    "animate": "^1.0.0",
    "animate.css": "^4.1.1",
    "bootstrap": "^3.4.1",
    "bootstrap-notify": "^3.1.3",
    "csspin": "^1.1.4",
    "dexie": "^3.2.4",
    "dexie-export-import": "^4.0.7",
    "file-saver": "^2.0.5",
    "font-awesome": "^4.7.0",
    "hammerjs": "^2.0.8",
    "jquery": "^3.7.1",
    "metro-bootstrap": "^3.2.1",
    "moments": "0.0.2",
    "ngx-childprocess": "0.0.6",
    "ngx-toastr": "^17.0.2",
    "node-notifier": "^10.0.1",
    "node-schedule": "^2.1.1",
    "popper": "^1.0.1",
    "react-bootstrap": "^1.0.0-beta.16",
    "rxjs": "~6.6.0",
    "tslib": "^2.6.2",
    "zone.js": "~0.13.0",
    "path-browserify":"1.0.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^16.2.8",
    "@angular/cli": "^16.0.0",
    "@angular/compiler-cli": "^16.0.0",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^14.6.2",
    "codelyzer": "^6.0.0",
    "electron": "^24.3.1",
    "@electron/remote":"2.0.12",
    "electron-jasmine": "^0.2.0",
    "electron-packager": "^17.1.2",
    "electron-reload": "^2.0.0-alpha.1",
    "electron-wix-msi": "^5.0.0",
    "jasmine-core": "~5.1.1",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.3.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage-istanbul-reporter": "~3.0.3",
    "karma-electron": "^7.3.0",
    "karma-electron-launcher": "^0.3.0",
    "karma-jasmine": "^5.0.0",
    "karma-jasmine-html-reporter": "^2.1.0",
    "karma-junit-reporter": "^2.0.1",
    "ngx-electronyzer": "^1.0.1",
    "nodemon": "^3.0.1",
    "protractor": "~7.0.0",
    "ts-node": "~10.9.1",
    "tslint": "~6.1.0",
    "typescript": "~4.9.3"
  }
}
node.js angular typescript webpack 电子

评论


答: 暂无答案