AngularJS и Electron: невозможно запустить приложение AngularJS внутри Electron

Я создаю простую игру, используя HTML 5, CSS 3, EcmaScript 6, AngularJS 1.7.7 и JQuery 3.3.1. Игра работает гладко при тестировании с использованием Firefox, но когда я портировал ее в настольное приложение с помощью Electron, игра пошла не так. Он показывает ошибки в электронном отладчике, как показано на скриншоте ниже.

Ошибки в Электроне

Uncaught Error: [jqLite:nosel] http://errors.angularjs.org/1.7.7/jqLite/nosel
    at angular.min.js:7
    at Object.Y [as element] (angular.min.js:33)
    at functions.js:5 angular.min.js:127
Error: [$controller:ctrlreg] http://errors.angularjs.org/1.7.7/$controller/ctrlreg?p0=gameController
    at angular.min.js:7
    at angular.min.js:97
    at ea (angular.min.js:79)
    at p (angular.min.js:71)
    at g (angular.min.js:64)
    at angular.min.js:64
    at angular.min.js:22
    at m.$eval (angular.min.js:154)
    at m.$apply (angular.min.js:154)
    at angular.min.js:22

AngularJS и Electron: невозможно запустить приложение AngularJS внутри Electron

Игра при запуске в браузере работает плавно, как показано на скриншоте ниже.

Браузерная версия игры

AngularJS и Electron: невозможно запустить приложение AngularJS внутри Electron

Поскольку Electron основан на Chromium и node.js, я тестировал его и на Chrome. Когда я тестировал с помощью Chrome, игра работала гладко. Я не могу понять, что не так с кодом. Я ищу в Google только для того, чтобы найти вопрос и ответ об Angular CLI, TypeScript и Electron, но я использую собственный Javascript, JQuery, AngularJS и Electron, поэтому их вопросы и ответы для меня бесполезны.

Я выкладываю веб-версию своей игры в Гитхаб, файл javascript вы можете посмотреть в этом связь. Десктопная версия игры почти не отличается от веб-версии, разница только в новом файле main.js и package.json. Для сценария в main.js и package.json вы можете посмотреть в конце этого вопроса (все остальные ресурсы, такие как изображения, звуки и т. д., Загрузились правильно, проблема, которую я обнаружил, - это AngularJS и файл functions.js).

main.js

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

let win

function createWindow() {
    win = new BrowserWindow({
        fullscreen: true
    })

    win.loadFile('index.html')

    win.webContents.openDevTools()

    win.on('closed', () => {
        win = null
    })
}

app.on('ready', createWindow)

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

app.on('activate', () => {
    if (win ===  null) {
        createWindow()
    }
})

пакет.json

{
    "name": "borneo-space-war",
    "version": "1.0.0",
    "description": "Simple space shooting game with unique concept.",
    "main": "main.js",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1",
        "start": "electron ."
    },
    "author": "Atallabela Yosua",
    "license": "GNU General Public License v3.0",
    "devDependencies": {
        "electron": "^4.1.0"
    }
}

Когда вы публикуете изображения сообщений об ошибках, это затрудняет копирование их текста для целей поиска. Для получения информации об ошибке jqLite:nosel см. Справочник по ошибкам AngularJS — jqLIte: nosel. Чтобы устранить эту ошибку ... вы можете включить полную версию jQuery, которую AngularJS будет использовать автоматически, и это сделает все селекторы доступными.

georgeawg 16.03.2019 18:43

Спасибо, но я использую JQuery с самого начала, и он тоже загрузился, так что вы имеете в виду под полная версия JQuery. Значит ли это, что я не могу использовать angular.element('элемент-селектор') внутри электрона. Как насчет того, чтобы изменить его на $('селектор-элемент') или document.querySelector('элемент-селектор'), он может устранять ошибки?

A-Naive-Dreamer 17.03.2019 00:12

Вы получите лучшие сообщения об ошибках, если будете использовать angular.js вместо angular.min.js. Для получения дополнительной информации о jqLite см. Справочник по API AngularJS — jqLite.

georgeawg 17.03.2019 00:35

Дополнительные сведения о другой ошибке см. в разделе code.angularjs.org/1.7.7/docs/error/$controller/….

georgeawg 17.03.2019 00:36
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
4
327
0

Другие вопросы по теме