Tips for transfering variables from an electron application to the backend of an Angular project

My goal is to develop a website and desktop application using the same code base. However, due to some minor differences between the two platforms, I need a way for my Angular app to distinguish whether it has been called from the web or from Electron.

I've attempted several approaches in my main.js file:

Firstly, I tried adding a URL parameter in the loadFile function like this:

win.loadFile('dist/project/index.html?electron=true')

Unfortunately, this approach resulted in the file not being found.

Next, I created a separate 'index.html' specifically for Electron:

win.loadFile('dist/project/electron.html')

However, Angular does not compile this HTML file as expected.

javascriptangulartypescriptelectron

Answer №1

To determine if your Angular application is running in Electron, you can check the process global constant after ensuring that the package @types/node is installed.

const inElectron = process.versions.hasOwnProperty('electron');
console.log(inElectron);
// Returns true if the app is running in Electron, otherwise false

Check out this link for a demonstration on StackBlitz

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

When working with Nuxt 3, the referrer header may sometimes return as undefined

I am looking to capture the referrer header and store it in a cookie so that I can later use it to populate an axios request during the user's journey on my website. In my app.vue, I currently have the following code snippet: const headers = useReque ...

javascriptvue.jsnuxt.jsvuejs3nuxtjs3

Ways to incorporate margins into text on PDF pages produced by Puppeteer without altering the background color

I am currently using puppeteer to generate PDFs that contain dynamic content. My goal is to include margins/padding above and below the text on consecutive pages. Unfortunately, when I try to add margins with the property margin: { top: "1cm", bottom: "1 ...

javascripthtmlcssreactjspuppeteer

Tips for updating the name of a variable (such as 'data') following the process of destructuring, like with the

If I have 2 SWR hooks in the same function (or some other hook that contains a data variable), export default function Panel() { const { data, error } = useSWR("/api/customer", fetcher); const { data, error } = useSWR("/api/user", fetch ...

javascriptreactjsreact-hooksnext.jsswr

What is the reason for the new page rendering from the bottom of the screen in React?

Whenever I navigate between pages in my React project, the page always starts at the bottom instead of staying at the top after rendering. I am using router v5 and have been unable to find a solution specifically for this version. I have attempted differe ...

javascriptreactjsreact-router

My Angular 2 observable is failing to provide my subscribers with the most up-to-date information when new data is added to

I am facing an issue with my Angular 2 observable where the subscribers are not receiving updated data, despite no build errors or console errors. The subscribers are only able to receive data during the component load in the ngOnInit section. Below is a ...

angularobservableangular2-observables

Preventing duplicate submissions in Ajax by serializing form data

I'm having trouble preventing double submissions on my form when I rapidly press the button that triggers a click event. I attempted to disable the button after a successful submission, but it still submits twice. Here is my code: <script> $(do ...

javascriptjqueryajaxhtml

Returning to the previous state in AngularJS when unchecking a checkbox

I'm a beginner when it comes to using angularjs HTML File: <div class='col-md-2 searchdisplay-col1' ng-controller="amenitiesController" style="margin-top:20px"> <h4>Amenities</h4> <label ng-repeat="facilityName ...

javascriptjqueryajaxangularjscheckbox

Why is there a false positive in the onChange event for the number type in React TypeScript?

I encountered an error on line 24 Argument of type 'string' is not assignable to parameter of type 'SetStateAction'.ts(2345) This issue occurred while working with TypeScript for a React experiment. const App: React.FC = () => ...

javascriptreactjstypescript

The application rejected the application of styles from 'http://localhost:1234/node_modules/primeicons/primeicons.css' as the MIME type (text/html) was not compatible

Encountering an error when attempting to add the following styles in index.html within my Angular 6 application. Getting a refusal to apply the style from 'http://localhost:1234/node_modules/primeicons/primeicons.css' because its MIME type ...

angularprimeng

Wrap the words around to fit a rectangle with a specific ratio, rather than a specific size

Does anyone have a solution for breaking text at word boundaries to perfectly fit a rectangle with a specific approximate ratio, such as 60:40 (width:height)? Please note that this is not just about setting a width limit (e.g. 80 characters or 600px) and ...

c#javaphpjavascriptalgorithm

Implementing a Unique Approach to Showcase the Initial PDF Page as Cover through Django and JS

I would like to enhance my script so that when a user hovers over an object on the template, a PDF cover page can be set for each object. Current process: Currently, I am able to upload files in the .pdf and .epub formats for each object with additional ...

javascriptjqueryajaxpdfpdf.js

Issue: React error message indicates that the .map() function is not recognized. The API response is in the form of an object, making

As a newcomer to REACT.JS, I am currently facing the challenge of extracting data from an API for my project. Utilizing "Axios" for sending the get request, I have encountered a situation where the response comes back as an array in one API and as an objec ...

javascriptreactjsfrontend

Acquire JSON data from a URL and display it on the webpage

I'm facing an issue where the JSON data I'm trying to fetch from a URL is not displaying due to an uncaught reference error in my code. How can I modify the code to ensure that the data gets shown? var url = "https://fantasy.premierleague.com/ ...

javascriptjsonrestdom

Utilizing JavaScript variables to generate a custom pie chart on Google

Greetings! I must admit that I am a novice, especially when it comes to JavaScript. My background is mainly in PHP. Recently, I came across a fantastic pie chart created by Google https://developers.google.com/chart/interactive/docs/gallery/piechart I a ...

javascriptphpjsoncharts

Angular UI-Grid encountering difficulties in rendering secure HTML content

I'm having trouble displaying server-generated HTML in UI-Grid. Specifically, I want to show HTML content in my column header tooltips, but no matter what I try, the HTML is always encoded. Here's an example to illustrate the issue: var app = an ...

javascriptjqueryangularjsangular-ui-grid

Instructions for passing a JavaScript variable to a PHP MySQL database

I am attempting to integrate a JavaScript variable into PHP MySQL, but I'm encountering issues with the insertion. Currently, it is being inserted as <javascript>document.write(window.outerWidth); </javascript> x <javascript>document ...

javascriptphpjqueryhtmlmysql

Update the regular expression pattern to extract nested tags and store them in an array of objects

For my small application, I am working on creating a regex pattern to identify "faux" html tags. The goal is to capture these tags within curly brackets and output them into an array of objects. Below is the code snippet with the current regex pattern: { ...

javascriptarraysjsonregex

Error: Unable to initialize i18next as a function

For my current project, I am utilizing TypeScript and i18next for internalization. TypeScript version: 2.1.4 i18next version: 2.3.4 @types/i18next version: 2.3.35 In the specific file: import * as i18next from 'i18next'; i18next.init({ ...

typescripti18next

Is the validity of the expression !args.value || args.value.length true?

After analyzing this segment of code, I noticed an interesting expression: !args.value || args.value.length For instance, consider the following scenario: let v = {}; console.log(!v.value); //outputs true console.log(v.value); //outputs undefined con ...

javascripttypescript

Utilizing Angular to convert a string array into an array of enum values through an HTTP GET request

I have a list of different user roles defined in my typescript code: enum UserRole { CONSULTANT, MANAGER, ... } There is a REST endpoint /users/id/roles that returns an array of strings representing the roles of a specific user: [ "CONSU ...

javascriptangulartypescriptenumstype-conversion