ExtJS7: Disable resource compression for CMD packages in package.json - extjs6

We have a custom ExtJS CMD package created and used for main application. CMD package uses external js that is already minified/compressed. However on production build for app ExtJS again compresses already compressed file, leading to errors in app wherever those external resources are referenced.
Do we have any flag that turns of compression in package.json for externally included resources?

Well, one answer would be to simply not package the external JS with your app, but to serve it separately. Guessing that's not what you want to do, though...
So, to package the file and not have it be compressed, you edit the app.json. In particular, the production block, where there should be a js entry. Make it look something like this:
"production": {
"js": [
{"path": "app.js", "bundle": true},
{"path": "external_file_that_should_not_be_compressed.js", "compress": false }
],
...
},

Related

Electron builder and asset files

I have an issue building for distribution an electron app, on macOS.
I have some folders that are in the root dir of my project, next to my index.js, which I need to be included in my packaged app.
After trying by hardcoding each and every file inside of package.json, which didn't help, I ended up with the following block
"extraResources": [
{
"from": "files/",
"to": "files/",
"filter": [
"**/*"
]
},
{
"from": "assets/",
"to": "assets/",
"filter": [
"**/*"
]
},
{
"from": "accounts/",
"to": "accounts/",
"filter": [
"**/*"
]
}
]
If I run the .app it appears that the files are not there. Opening the Contents/Resources, I see they are there, so, toying around I discovered that the app is looking inside the app.asar container, where obviously the files are not.
I found a small hack by adding a couple of '..' in front of all my paths, so it goes outside the app.asar container but I really think this is a bit idiotic to be the solution to my issue.
Plus, I plan to build this for multiple platforms and I have a feeling that if I go through with this hacky way of fixing it, I'll have to create a hack for each platform, which I'd rather not do...
if you have files that you are using in the html (in my example assets/css etc.), or requiring in any file and have a folder structure like this, the folders would be automaticly in the asar.
Note: asar is read only package, you cant add, remove or edit files after creating this file.
the using of the css files in the assets/css folder is simple:
use the relative path from your html file and it would work on all plattforms.
if you have files that are not related to your project, or not used in your project but should be available in the packaged app:
you must use "extraFiles" in your package.json
extraFiles would copy the files to the app content directory on Mac OS, on Windows and Linux it will copy it to the app root directory. If you use extraResources it will copy the files to Contents/Resources on Mac and on Windows it will copy the files to resources Folder.
"extraFiles": [
"files",
"assets",
"accounts"
]
note: empty folders would not be copied
in your app use something like this module to get the root path of your app, and use your files with this path
alternative: use process.execPath and replace your executable name to get the correct path
based on your comment:
if you must load this files (css/js) in your app html, you can load dynamicly on the onload event with the solution i provided you above.

Include dll file in Electron Builder

I have a dll-file that I need to use for a separate process that is started by the Main process in my Electron project.
So I want to include this dll in my electron project and I'm using electron-builder to build the project. The problem is that I don't know how to include the file without it being added in the asar package, which is not reachable from the separate process directly. When I use app.getPath() to get the path for the running instance it will look something like this:
C:\installPath\myProject\resources\app.asar\my.dll
my electron-builder.json currently looks like this:
{
"productName": "myApp",
"directories": {
"output": "release/"
},
"files": [
"**/*",
"my.dll"
],
"win": {
"icon": "dist",
"artifactName": "myApp.${ext}",
"target": [
"portable"
]
}
}
Are there any way to get my.dll included in the resources folder (or somewhere else) instead of in the app.asar?
Thanks!
Solution1:
You should be able to do it with "extraResources" param, put your .dll under resources folder, then create config param named "extraResources" under targeted dist.
The installation process should copy the file(s) to app’s resources directory
https://www.electron.build/configuration/contents#extraresources
Solution2:
You can download .dll file from a web server then move it to the desired place with fs.
If you Keep the DLL file in the Dist folder, Electron-builder tool will include that file into the app.asar file.
This is the limitation of that because if you trying to load the dll file using ffi module or your own written native node module then it will not load the file from app.asar file. so you have to keep the dll file outside of the app.asar file manually or make this copy setup part of your build system.

Best practice for front end library management using Bower

I want to use bower add manage my library, my question is along with the js files, it always comes with some extra json or git related files. I don't want to push those files to the client, is there a recommended way rather than extract js filed manually?
Bower allows you define in your bower.json file a list of files it will ignore when installing your package:
ignore
Recommended Type: Array of String
A list of files for Bower to ignore when installing your package.
Note: README (all variants of case, .md, .text) and bower.json will
never be ignored.
The ignore rules follow the same rules specified in the gitignore pattern spec.
For example:
{
"name": "my-project",
"version": "1.0.0",
"main": "path/to/main.css",
"ignore": [
".jshintrc",
"**/*.txt"
],
...
}
Another option is keeping only the files you want to distribute in the Git tags which represents you package versions.

What is the "main file" property when doing bower init?

What is the use of property main file when you run bower init? I have been looking and many people says that it currently has no purpose.
Is that true? Bower's documentation doesn't explain it either.
According to the Bower.io documentation
main
Recommended Type: String or Array of String
The primary acting files necessary to use your package. While Bower
does not directly use these files, they are listed with the
commands bower list --json andbower list --paths, so they can be used
by build tools.
Preprocessor files like CoffeeScript should be compiled.Do not include
minified files.Filenames should not be versioned (Bad:
package.1.1.0.js; Good: package.js).
I think it's more for the package management, and build tools like Grunt and Brunch. For example, Bootstrap's bower.json looks like :
{
"name": "bootstrap",
"version": "3.0.3",
"main": [
"./dist/css/bootstrap.css",
"./dist/js/bootstrap.js",
"./dist/fonts/glyphicons-halflings-regular.eot",
"./dist/fonts/glyphicons-halflings-regular.svg",
"./dist/fonts/glyphicons-halflings-regular.ttf",
"./dist/fonts/glyphicons-halflings-regular.woff"
],
"ignore": [
"**/.*",
"_config.yml",
"CNAME",
"composer.json",
"CONTRIBUTING.md",
"docs",
"js/tests"
],
"dependencies": {
"jquery": ">= 1.9.0"
}
}
When I build in Brunch, it pulls these files from my bower_components folder in my public folder.
According to Bower's JSON Specification (https://github.com/bower/spec/blob/master/json.md#main), the "main" property is used to list the files primarily used in the project. The files listed are not actually used by Bower in any way, they are apparently there for the purpose of being used by other build tools.
Here is the official specification:
main
Recommended
Type: String or Array of String
The primary acting files necessary to use your package. While Bower does not directly use these files, they are listed with the commands bower list --json and bower list --paths, so they can be used by build tools.
Preprocessor files like CoffeeScript should be compiled.
Do not include minified files.
Filenames should not be versioned (Bad: package.1.1.0.js; Good: package.js).

bower install take repo, not specific files in main

I am trying to install some js files via bower. My repo has a bower.json with a main property, however the whole repo gets installed to components/, not just the files in the dist/custom/ dir.
Here is what my bower.rc looks like
{
"name": "jquery-m",
"version": "2.0.2mup",
"description": "Meetup custom build of jQuery 2.0, used on mobile",
"main": [ "./dist/custom/" ],
"license": "MIT"
}
Is this the way bower is supposed to work? I thought it was possible just to specify certain files with your main property.
Yes, this is how Bower is meant to work. Bower-installer looks like a more lightweight solution than Grunt to solve the exact requirement you're describing and get just the files you need to be deployed to production.
Yes, that's how Bower works.
It always look for the matching tag on the repo; if cannot find one, it goes with the default branch, and download it.
The unique usage I've seen so far for the main property of a bower.json file is for integration, for example with build tools, like Grunt (there are lots of other bower related tasks, just Google around) and others.
This is a common misconception.
As stated in Bower documentation, the main property is a string/array listing the primary endpoints of your package.
Bower package maintainers (and maybe users, using the overrides property) can use the ignore property, which is an array of paths not needed in production that you want Bower to ignore when installing your package.
Example:
{
"name": "stackoverflow",
"version": "1.0.0",
"ignore": [
"test/**",
".jshintrc"
],
"dependencies": {
"foo": "~1.1"
}
}

Resources