How to Disable Resource Compression for CMD Packages in ExtJS 7

Discover how to prevent automatic compression of external JS files in ExtJS 7 CMD packages to avoid application errors.
---
This video is based on the question https://stackoverflow.com/q/64316866/ asked by the user 'ducktyped' ( https://stackoverflow.com/u/879921/ ) and on the answer https://stackoverflow.com/a/64325410/ provided by the user 'Robert Watkins' ( https://stackoverflow.com/u/1467976/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: ExtJS7: Disable resource compression for CMD packages in package.json

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
How to Disable Resource Compression for CMD Packages in ExtJS 7

When working with ExtJS, particularly version 7, developers often run into issues with resource compression during production builds. If you have a custom ExtJS CMD package that relies on externally minified and compressed JavaScript files, the framework's automatic re-compression can lead to unexpected errors and malfunctions. This guide will guide you through a solution to prevent this unwanted behavior by properly configuring your package settings.

The Problem

You may have created a custom CMD package to streamline your ExtJS application, but you have encountered a significant issue: ExtJS is automatically compressing files that are already compressed. This can result in errors throughout your application whenever these external resources are called upon.

Common Issues Caused by Double Compression

Application Errors: Incorrect code execution and failure to load resources properly.

Performance Problems: Additional load times due to unnecessary handling of already optimized files.

Debugging Complexity: Troubleshooting becomes harder as issues arise from seemingly valid code.

The Solution

Fortunately, there is a simple way to configure your app.json file to avoid compressing these already optimized external JS files. Here’s how you can do it step by step.

Step 1: Locate Your app.json File

Your project should contain an app.json file, which is crucial for managing your application’s configuration settings. You need to modify this file to properly set up your production build environment.

Step 2: Update the Production Block

Inside the app.json file, locate the production block. This section is where various settings related to your production build are defined. You will specifically focus on the js array, where you include the JavaScript files to be packaged.

Step 3: Edit the JavaScript Entries

Here's how you can structure your js array:

[[See Video to Reveal this Text or Code Snippet]]

Breakdown of the Code:

"path": Indicates the location of your JavaScript file.

"bundle": true: This setting includes the specified file in the build bundle, which is required for your application's operation.

"compress": false: This is the critical setting that prevents the specified external JavaScript file from being compressed again.

Step 4: Test Your Application

After saving the changes, build your application again for production. Check to see if the errors related to the external JS files are resolved. This will ensure that your application runs smoothly without the complications raised by double compression.

Conclusion

Managing external resources in your ExtJS application doesn't have to be a headache. By following these simple steps to adjust your package.json and app.json files accordingly, you can avoid unnecessary compression that leads to errors. This not only helps maintain optimal performance but also simplifies your development and debugging efforts.

With the right tweaks, you'll get your ExtJS application running smoothly again. Happy coding!