'ionic cordova run android' command stuck for 11 minute - ionic-framework

I have two git branch, one is development and the other is lazy-load.
I did lazy load in my lazy-load branch, but it stuck for 11 minutes after 'copy finished in 19.81 s' which case the build process too slow.
The development branch which is not lazy loaded, build app normally, but it takes too much time to startup.
I want lazy-load branch should not take a long time in its build process.
Image when i run command ionic cordova run android
When it finishes building the image.
It seems that webpack takes 11 minutes to finish its task.
When I run the app in the development branch, which does not have any lazy load the webpack takes 34.59 s.

If you want to reduce the amount of work ionic has to do between builds while you're editing, try using the livereload flag. It will then only do a webpack update instead of a webpack full start and finish. This way you can make edits and test without having to run through the ~11 minute process every time.
ionic cordova run android --livereload
or
ionic serve
As for the long build time, I would need to see more of your code if this just started happening recently. However, on my project(s), when I'm building it can take over 10 minutes to build, especially when running with the --prod flag.
Also, always make sure you're on the latest of Ionic:
npm install #ionic/cloud-angular#latest --save
sudo npm update -g cordova
sudo npm update -g ionic

Related

Using nx run-many shows: Another process, with id ..., is currently running ngcc

We are having an NX monorepo with 10+ Angular apps and 150+ libs. Our CI server is running all builds in docker containers using Ubuntu. We are storing and sharing the computation caching across all build agents. We are now using nx affected:apps to detect for which apps the builds need to run and nx affected:libs to create a list of affected libraries, for each app. This approach enable us to run distributed builds. We now have a dedicated build plan for each app and its dependent libraries.
So, we are using nx affected, computation caching and distributed builds but we are still struggling with long build durations because of the large number of tests we need to run.
The next step we took was to use nx run-many to run those tests in parallel but this did not work for us. Even with 2 parallel processes we see the following error:
Another process, with id ..., is currently running ngcc. Waiting up to 250s for it to finish.
We have tried all the workarounds without any success
If I run the same command inside the same docker container but running on my local machine, everything works ok.
So, instead of reducing the build time, this approach is adding to the total build duration (if we want to run 4 parallel processes we need to wait for 16min before the tests actually start).
Any ideas why this is happening?
Had a similar problem with NX throwing ngcc is already running
What helped me was to set the flag parallel.
from:
npx nx run-many --target=build --prod --all
to:
npx nx run-many --target=build --prod --all --parallel=1

Logs not visible while npm task is running

In AzureDevops, when running an NPM task on a private agent, the logs are not visible until the task completes.
The output just appears blank e.g.
This happens for all npm tasks, from tasks that result in large log output and small.
The task above is a long running task which uses TestCafe to perform functional UI tests on a website. However, the same happens for other npm commands such as install.
I tested npm tasks, the log can be loaded normally:
Here are a few points you can try to see if it returns to normal:
What version of npm are you using? If not latest,you can try the latest npm task version.
According to your interface, you are using an older version of UI , you can try to enable Multi-stage pipelines in Preview features.
Try to run with private agent and see if it's still the same.

Electron app size is 450 mb for linux and 238 mb for windows, how to reduce it with respect to visual studio code

I have built an electron app and packaged it using electron packager. I made windows bundle of 238MB and linux version is 450 MB. I compare this with visual studio code which is also electron app. They have relatively very low file size of 50 MB for windows and 60 to 70 MB for rpm and deb packages.
My app is a simple, whereas visual studio code has more functionalities.
I want to reduce file size, how to do this?
I have already seen this , I am not using electron build but electron packager. enter link description here
Here is cmd I use inside package.json
packagerLinux: electron-packager --out Linux64 --overwrite --platform linux
packagerWindows: electron-packager --out winx64 --overwrite --platform windows
Let me know if you need
i am currently having the same issue and i spent a lot of time trying to figure out how to reduce the size of my 250MB Hello World package in Windows, obtained using electron-packager.
There is a github issue on it. To sum up briefly, the main problem is that Electron apps require both NodeJS and Chromium to be installed in order to work, so Electron packages contain both, increasing a lot the size of the file. This appears to be a non solvable problem.
Meanwhile, you can try to build the app using npm run build --prod, which reduces a bit the overall size of the folder.
Edit: i found out this package called modclean. It basically search your node_modules folder for unnecessary files and remove them.
Simply install it with
npm install modclean --save //install locally
or
npm install modclean -g //install globally
and then launch it with modclean or modclean -n default:safe.
In this way i managed to reduce the size of my final folder of around 30MB. Not a lot, but still something :)

What code do I need to enter to make expo project function?

I am not a developer, but I had an app built a couple months ago. The developer we had won't help us at all anymore (not sure why).
Please excuse me if I don't use proper terms.
So the project was done on Expo. I no longer have access to the original expo project, but I have all the code he wrote in a Github repository.
Is is possible to take the code from Github and paste it into Expo XDE and possibly reproduce the app on Expo? (Or Does that sound possible?)
Please let me know.
Yes, you could do this. It is important, that you copy all project files from the GitHub repository into your new Expo project. Don't forget to download all necessary libraries into your new Expo project, e.g. via npm install.
I'm a complete react native noob, I've been doing this, and I love it:
Develop prototype on https://snack.expo.io
Here I can develop and test on the browser, test on my phones, and on emulators. It's great.
When I'm ready to build, I download the code package from the Snack IDE
This downloads a zip file with everything except Expo and imported libraries.
I unzip and go into the folder with my terminal and install the libraries.
Inside the folder, I run these commands to install Expo and the regular libraries:
$ npm install expo # install expo
$ npm install # install a bunch of required libraries
# Then I run these two lines until my project builds
$ npm run web # try to run - it will tell me which libraries to install, one by one
$ npm install <library> # install each library
Eventually I'll move to using command-line only, but this is both a no-brainer for a noob like me and it's like training wheels for me to learn npm and expo.

What does ionic serve executes in ionic 2?

I've been trying to add a gulp task to compile jade files I'm creating.
The tasks is working fine, however, when I run ionic serve it doesn't execute the gulp task I created
I assume that Ionic is using webpack, however I'd like to know what I need to do to make my new task work as well
The output I got is:
➜ ionic git:(master) ✗ ionic serve
∆ Compiling and bundling with Webpack...
√ Using your webpack.config.js file
∆ Compiling Sass to CSS
√ Matching patterns: app/theme/app.+(ios|md|wp).scss
∆ Copying fonts
√ Matching patterns: node_modules/ionic-angular/fonts/**/*.+(ttf|woff|woff2)
∆ Copying HTML
√ Matching patterns: app/**/*.html
√ HTML copied to www/build
√ Sass compilation complete
According to Ionic2 documentation regarding app-scripts, they have decided not to use gulp in their project any longer:
What About Gulp?
Historically Ionic apps have used gulp as tool to facilitate the build
process. Over the years, gulp has seen less and less development, and
has started to accumulate deprecation warnings. By taking advantage of
standard and dependency free NPM scripts, we are reducing dependencies
and simplifying the development experience.
Instead they are using Ionic app scripts, that are indeed npm scripts for their build process. From the same mentioned doc:
When ionic serve or ionic run are invoked, it ultimately calls an NPM
script. These npm scripts call the #ionic/app-scripts library to
execute the build process.
To accomplish your goal, i.e. to use Pug (formerly known as Jade) for the templates, you may do either of the following:
One: Write a custom app script instead of watch.config.js. The original script is available on here on github.
Two: Write a Cordova hook for before_compile.
As a reference this answer is written on 2016-Nov-12.