im trying to set up an electron app with typescript.
So in my app.ts i have to following statement to tell electron which file should be opened:
win.loadURL(`file://../views/index.html`);
When i had only javascript it worked fine.
But now after compiling electron just opens an empty window.
Because im compiling my typescript to a different directory.
Is there a variable for the root dir or something dynamic path resolution i could use?
Thanks
This is probably caused because your file location is not absolute, this may be fine when debugging your app because your running it from a specific place but once you compile it will not be able to find the file try using something like this:
win.loadURL(__dirname + "../views/index.html");
__dirname is a variable provided by NodeJS which is the absolute location to the directory of the current file.
Related
I develop a nextjs application. Inside the root folder, I've made landing/pages/ folder and I want to run dev server with those pages using next dev ./landing. The point is to create a separate app using the same codebase, configs, etc.
Dev server runs properly, but most features don't work:
.env is not read from the root folder (the workaround is to use cp .env ./landing && next dev ./landing). but it's an ugly way to solve it
assets are read from public folder inside the /landing. But I'd like to use the public folder from the root.
I can't use components from folders that are "above" /landing folder in the project structure. The compiler throws an error You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.
Is there any custom configuration to solve the problem? Maybe there is another way to have something like two "pages" folders in which there is the same source code, but thanks to it I could build two separate apps?
I've pushed my current code to the following repository:
https://github.com/michalgrzasko/nextjs-2-pages-example
Just run dev server using yarn dev. To reproduce errors:
Uncomment process.env.NEXT_PUBLIC_APP_BASE_URL in landing/pages/index.tsx
Uncomment <Nav /> component in the same file
.env is not runnable files, if you will load from "somewhere" - you don't need it.
You should focus on the next.config.js file.
Check this, maybe will help.
Anyway, you will need:
-API from your second source(from where you like to load config)
-Load config every time once you dev build your project.
-use process.env.your_name in your classes/functions
I have a question about my Next.js project.
I have configured my project to be build over the standalone mode for the deployment
experimental: {
outputStandalone: true
}
Using this, it generates me a standalone folder with a server.js like expected.
The main issue is that I am using an env variable in my sources, called NEXT_PUBLIC_API_BASE_URL
When I start my project in development mode (using next serve), it works fine.
But when I start the standalone generated file (using node server.js) it does not work.
It seems that the file is loaded on the "server side", when I console.log its value in the .next/standalone/server/pages/_app.js it shows the right value in the node console.
But it looks like next is using files under .next/static/chunks/pages/ and an other app.js that does not seem to access process.env (on browser side).
I thought that prefixing my env var with NEXT_PUBLIC was meant to work this way, it seems not.
Any idea on how it works there ?
On your build server, create the file name ".env" and put all of your environments.
NEXT_PUBLIC_API_BASE_URL=https://api.example.com
please refer Docs
From the Vue CLI https://cli.vuejs.org/guide/deployment.html, it stated that the dist directory is meant to be served by an HTTP server. But why can't I preview it from the index.html? Cause my understanding is that Vue is just a front end JavaScript framework, so one should be able to preview it from any browser. If am to create a simple vue project using a cdn, it can be directly previewed on the browser. But this is not the case for the vue project created through the CLI. Can someone explain this.
Take a look into the Chrome Dev Tools. You will see a couple of errors similar to those:
As you can see, there are a bunch of files that fail to be imported. This is because these files are not imported using a relative file path, but an absolute one (starting from root, as visible by the prepended / in all files in the index.html).
If you run a local server from the dist directory root will resolve to this directory, allowing the files to be imported properly and your site to be visible in the browser.
However if you simply open the index.html file in your browser, / will resolve to the root of your operating system, which does not contain the files. If you were to copy all those files into the root of your OS, so that the paths would resolve successfully, you would not need a server to view your Vue application.
CLI projects are built with the use on a server in mind. The idea is to just be able to deploy the files in the dist directory to a server and have a working Vue application.
Just to add to a great answer from #aside.
You can use a publicPath configuration option of Vue CLI and set it to '' or ./ - this should be enough to make it work from file system
The value can also be set to an empty string ('') or a relative path (./) so that all assets are linked using relative paths. This allows the built bundle to be deployed under any public path, or used in a file system based environment like a Cordova hybrid app.
vue.config.js
module.exports = {
publicPath: ''
}
I am quite new to Node.js and have come across the "__dirname" and found it to be quite handy for getting the absolute directory path of the script. But I am curious as to how it is implemented, how is it able to understand the directory structure. I have gone through the node js source code but I am not able to find a proper answer.
these object are available globally to use in node
create a file anywhere in your system with any name suppose app.js
and write in that file
console.log(__dirname);
run it like :-
node app.js
it will print the path of current directory.
I am trying to set up an ipad app that relies on using javascript for part of its functionality. I need to have the files in a folder named javascript to have some code I am using work properly.
I have created a symlink from my javascript files into the folder I set up and have included the files in the copy bundle resources in the appropriate build phase.
My issue is that under that section xcode says the files are in javascript/...
So in theory everything should be in the right folder. However, in my code I am using
[NSBundle mainBundle] pathForResource: pathName ofType:nil]]
and it returns nil when I set the path to the file in the file path and name listed in xCode.
Is there something I am not doing right to the app to have to proper file path names?
I am using the ipad simulator and xCode 5
For files that are in a subdirectory of your app bundle, you want to use the method pathsForResourcesOfType:inDirectory: