Angular2 CLI with electron - javascript

I am trying to set up an Angular2 CLI project in electron and am not quite sure where to start after getting the basic Angular piece generated by the CLI set up.
I have used Angular2 with electron successfully before, but that was not with the CLI piece.
So, for clarification, I have generated the basic Angular2 App using the Angular2 CLI. Now I am unsure of how to wire it up with Electron.
Has anyone done this before? Maybe you could provide some insight. Any tidbits of help will be greatly appreciated.
Thanks!

just figured I'd let you all know the solution I found. Turns out when you do an ng-build using the CLI it is completely dropping the dist folder and then remakes it using the src folder. This means it gets rid of the main.js, renderer.js, and package.json electron needs which are stored in the dist folder.
In order to ensure the Electron files (main.js, package.json, and renderer.js) get carried over to the Dist folder each time I use ng build, I set up a task using GulpJS to copy them to the correct location. Anyways, hope this helps anyone facing the same issue!

Related

How to Build Production Next.js with Custom Server (Nest.js)

I need help on how should I do compile/build my project using Next.js when I use a custom server.
I actually use Nest.js (TypeScript Node.js Framework) as my Backend and wrap my Next.js inside it (since Nest.js is node based so I think this should work) and it actually working.
This is one of the tutorial that I followed: https://javascript.plainenglish.io/render-next-js-with-nestjs-did-i-just-made-next-js-better-aa294d8d2c67.
And when I tried to build production, Next.js give me error like this
So basically, when I use nest build command, it successfully compiled but only the backend part (which is Nest.js).
Whenever I tried to run into localhost, it would error and said the same thing above.
And the same as the second command (which is I tried to add next build command), it would show the same error.
I know where is the problem is (they basically need the compiled .next/ folder) but kinda confused how to solve this.
Do you have any idea on how I should tell the compiler that the pages/ folder has been moved into src/client/pages?
[EDIT]
Just for your information, this is my folder architecture.
Any kind of ideas would be a really help. Thanks guys!
I just fixed my own issue right after several minutes I post this even I've struggle for like hours!
So, just want to let you guys know if anyone ever comes with the same issue. Somehow, my solution is comes because this Next.js CLI docs, so thanks to that.
What I did is just simply change the directory first into the right Next.js folder's code and start compile it. I did it from package.json build scripts.
"scripts": {
"build": "NODE_ENV=production nest build && NODE_ENV=production cd src/client && next build"
...
}

Run ReactJS application which using webpack and babel without server and by opening HTML file

I couldn't find the proper answer for my problem so if there is any same question please let me know.
I'm new in ReactJs and I was wondering if anyone could help me.
I have the react project which is using Webpack to bundle components. It works fine with npm start on port 3000 but I need to run it without the server and I want to see it by opening the HTML file. The App just calls APIs in its components so it doesn't need the server.
I have the same project and it works well but because it uses Webpack as well it's hard to find out what is missing in my project.
I would be grateful if anyone could help me!
Thanks
To generate an html file you can run npm run build that will generate all your static files in the build directory including a static html.
However i think you would still need a server to make async calls.

Issue with generated react build from react-scripts

I created react project with react-scripts. After done some functionality, I tried to build the project. For this, I used npm run build command. When I run this command, I can able to generate build folder.
Now, I moved build folder to my server and tried to execute. It's give me blank white screen and saying index.js not found.
I am not sure, how to resolve this issue. Can you please help me. thanks.

Adding cordova to existing angular-lungo template

I am trying to figure out how I would go about adding cordova to my project which has angular.js and lungo.js included in it. Here's the error I get :
Error: Current working directory is not a Cordova-based project.
How would I make it a Cordova project?
I also tried the other way around. That was : By creating a cordova project first, then adding angular.js and lungo.js in it. I'm using grunt to init the scaffold template.
Here's the error:
Philippes-MacBook-Pro:hello Phil$ grunt-init lungo-angular-bridge
Running "init:lungo-angular-bridge" (init) task
This task will create one or more files in the current directory, based on the
environment and the answers to a few questions. Note that answering "?" to any
question will show question-specific help and answering "none" to most questions
will leave its value blank.
Warning: Existing files may be overwritten! Use --force to continue.
Aborted due to warnings.
Now, I'm not sure how I could make cordova, angular.js, lungo.js all be included correctly.
Any help would be appreciated.
Thank you,
Phil.
First thing I would check is if the .cordova file is being created.
If not, try running this command from the repository: cordova create

Yeoman - Current best way to use it with AngularJS & Express?

I am using Yeoman 1.0 beta and not interested in the express-stack branch. What, then, is the recommended/best way to use Yeoman to scaffold an Angular project within Express?
I tried running yo angular --minsafe in the root directory of the Express project (where app.js and package.json are), but Yeoman was trying to override package.json, and the Angular files didn't go into the public subdirectory properly. Also I am not sure if I can just go manually moving the Angular files around without breaking Bower and Grunt functionalities.
Would be great to have some advice, thanks!
This project seems to cover all of the requirements (and even has optional support for MongoDB): https://github.com/DaftMonk/generator-angular-fullstack
I've just tried it locally and it works:
npm install -g generator-angular-fullstack
yo angular-fullstack [appname]
See the GitHub page for more info.
If you install Angular first through Bower, then add Express to package.json and run npm install - you'll have an Express server fire-up the /dist directory. (Edit app.js to route to /dist and let angular handle routing)
See this SO question for more information: Yeoman inside ExpressJS
This is a comparison of alternatives for starting an AngularJS app. Several of them involve Express too.
http://dancancro.com/comparison-of-angularjs-application-starters/
After reading MANY blogs and answers, I managed to get it all working...
Check out this repo: https://github.com/malixsys/malix-yae
When changes are made to html/server or lib, the server is restarted and the page should refresh
When changes are made to HTML or JS files under html/client, the server is not restarted but the page should refresh
When changes are made to CSS files under html/client, the new stylesheet should be injected directly without refreshing

Categories