When I am trying to deploy my application in my prod the WAR do not
have the images directory so i get my application deploy without any
images.
What could be the problem?
It looks like the cause of the problem is "gulp-imagemin", as a workaround remove this line:
.pipe(imagemin({optimizationLevel: 5, progressive: true, interlaced: true}))
from: gulpfile.js
Your images must be in src/main/webapp/content/images to get minified and copied by gulp to target/www/content/images and then be copied at the root of you war in content/images by maven or gradle.
If gulp-imagemin says it minified 0 images, it's often due to missing binaries needed in these node modules:
optipng
jpegtran
gifsicle
If you look eg. into node_modules/optipng-bin, you'll see that the optipng binary is missing (should be in a vendor subfolder).
They are not compiled during npm install, and it's completely silent :)
Installing the zlib1g-dev package fixed the issue on a fresh Debian 9 system.
I had to install build-base and zlib-dev
https://github.com/imagemin/optipng-bin/issues/84
Generally speaking, you need several build tools on your system to build a JHipster prod package (make, g++ for scss, etc.).
Related
I dont want to install npm or nodejs on prod linux. it currently runs an asp.net core app.
I want to check whether it is using a specific package (postcss).
In dev environment I can see multiple postcss folders in node_modules folder.
Thats easy. But in prod there is only dist folder with compressed js files.
I grepped them and could not find any postcss string in it. But I am not sure if that is correct way to do it.
For example there is also no devkit string anywhere in .js files but there is license terms for #angular-devkit/built-angular in dist/3rdpartylicenses.txt - which begs the question - why would it need to keep license of a package which is not used.
And postcss is one of devkit dependencies..
So in short - how to make sure there is not even a slightest trace of postcss on a machine without npm ?
No way. Why you don't want to use npm? For its move have to builder analizator.
npm install -g webpack-bundle-analyzer
Look at that: https://medium.com/angular-in-depth/optimize-angular-bundle-size-in-4-steps-4a3b3737bf45
First of all, I am generating an electron native application using electron-builder, npm and npx.
The next commands/steps are being executed to compile and generate the electron native application:
npm run build -- --prod --build-optimizer (to compile app)
npx electron-builder build --windows (to generate an electron windows app)
Later, I obtain a myApp folder which contains:
/win-unpacked
electron-builder-effective-config.yaml
myApp.exe
My application uses the node_modules folder which contains all node dependencies used in my application.
My question is: are there any way to unpack the native application or similar and patch new changes inside node_modules?
After perform an investigation, I have discovered that node dependencies are packed in system cache inside an app.asar file which contains a dist folder with some .js files.
In developer tools:
Inside app.asar:
Are there any way to "deploy" node modules folder with the aim to perform patch operations of each package and change the code inside node modules folders?
I will appreciate any kind of help.
Asar is a read only archiv format, so you cant patch any files in the archive.
But what you can do is to disable the asar option in your build config.
So in your package.json define it like this:
"build": {
"appid": "........",
"win": {........},
"asar": false
}
if you build this, there is no asar archive anymore and you can overwrite any file...
what you can also do is using asar programatically. So you can unpack the asar archive, updating files and package new archive. See here how you can use it
Contrary to what is being said here, patching a .asar archive is totally possible. I have published a library on NPM called patch-asar that does specifically this.
I have a project on Laravel 5.4; I'm absolutely new to front-end package managers.
I used npm to install 4 packages in my project, so my node_modules folder has about 210 MB.
I used Laravel Mix to combine in groups required dependencies and files, then I run npm run dev.
My webpack.mix.js looks like :
let mix = require('laravel-mix');
mix
.copy('node_modules/jquery/dist/jquery.js', 'public/js')
.combine([
'node_modules/video.js/dist/video-js.min.css',
'node_modules/videojs-record/dist/css/videojs.record.css'],'public/css/recordDependencies.css')
.combine([
'node_modules/video.js/dist/video.min.js',
'node_modules/recordrtc/RecordRTC.js',
'node_modules/webrtc-adapter/out/adapter.js',
'node_modules/videojs-record/dist/videojs.record.js',
'node_modules/jquery/dist/jquery.js',
'node_modules/blueimp-file-upload/js/vendor/jquery.ui.widget.js',
'node_modules/blueimp-file-upload/js/jquery.iframe-transport.js',
'node_modules/blueimp-file-upload/js/jquery.fileupload.js'
], 'public/js/recordDependencies.js');
So, it generates me this files. Making a small test, I replaced the node_js directory out of the project, and everything still works.
So, the question is :
Can I delete this huge folder - node_modules, or it must live in
kernel of my project, at the deploying as well ?
In frontend applications node_modules are only required for compiling resources. You would not want to deploy node_modules because they contain unobfuscated code. Only deploy compiled files.
I recently started working on a web project. I'm using:
NodeJS as a server
Bower - to get all the dependencies
GulpJS - for build and other tasks
Git - to save my work
For simplicity, let's say that I'm only writing HTML/CSS/JavaScript.
It doesn't seem to make sense to save ALL the project files in Git including external JavaScript libraries, since I only want to save the core files (the files that I created and modified myself).
On the other hand, if I want to hand over the project to another developer and I only hand him my own files without all the dependencies and libraries, how will he know which dependencies to get? How will he be able to build and run the project?
(I'm still new to bower, gulp and node)
So, what files do I need to save in my repository (the minimum number of files) to be able to build and work on the project?
According to what you said, your .gitignore file should look like this :
node_modules
bower_components
dist
.tmp
On the other hand, if I want to hand over the project to another developer and I only hand him my own files without all the dependencies and libraries, how will he know which dependencies to get?
You don't include your dependencies such as the node_modules and bower_components but the package.json and bower.json are tracking those dependencies so that when a new user makes a clone, he only has to npm install and bower install.
This is, if you took care to use the --save or --save-dev flags when you npm or bower install new packages.
There's a quite active repository on github, containing predefined .gitignore files for different languages, platforms and buildtools.
https://github.com/github/gitignore
Although there's no bower- or gulp-specific configuration there (yet), I usually find it quite useful when trying new things.
Installing a mean stack:
$ sudo npm install -g meanio
$ mean init yourNewApp
Checking file structure:
$ ls
AUTHORS Procfile config packages
Gruntfile.js README.md karma.conf.js server.js
LICENSE bower.json package.json
I am missing the correct file structure even though the app "works". Everything should be installed correctly. Where is public and the server folder?
These folders are also missing if I clone any other mean stack project from github.
I had a same problem because I am beginner, but it seems that MEAN Stack file structure has been changed few weeks ago. Quote from Mean.io docs says:
'From v0.4.0 all the application code has been integrated into a number of packages. Each package uses MVC on the server and client. Below is the overall file structure as well as the package file structure'
Source: http://mean.io/#!/docs
This mean.io file structure is organised in packages and each package has own MVC for server/client sides folders. Also, please take a look on mean.io blog site where there is article about package types: http://blog.mean.io/2014/06/extending-mean-io/
If you are windows user and you try to follow mean.io website instructions, you probably will be confused how to install all the stuff in order to see the application lunched in your browser and probably you can't manage to have all the sources in your project. Follow their video from homepage or DO THIS:
Install Git from http://msysgit.github.io/ and then in then fallow
the instructions from here
http://www.computerhope.com/issues/ch000549.htm in order to add your
“git” var path;
Install node.js from http://nodejs.org/;
Install MongoDB from http://www.mongodb.org/. Create in your "C:\" the "data" directory and inside of "data" create "db" directory. Add like step one a new PATH var but this time for mongodb. For this you should find out your mongodb root in the window system (ex: C:\Program Files\MongoDB 2.6 Standard\bin).
Run in cmd: npm install -g meanio ;
Run in cmd: mean init myApp;
Go into myApp folder using cmd and there run: npm install;
Run in new cmd window in C:\ : mongod;
Run in new cmd window but this time in your myApp location: grunt. If you obtain an error saying that grunt is not recognized then run this comand line "npm install -g grunt-cli";
Go in browser and type http://localhost:3000/.
Hope this will be useful for someone new like me in this area.
In Mean.IO total project is divided into number of modules and these modules are known as package. these packages mostly independent from each other. and each package contains public and private folder separately. for more see the mean documentation.
Try installing meanjs. It's a fork from the mean.io. Many developers have shifted to meanjs as it's more stable and from the same guy Amos Haviv who started mean.io.