ExtJS Project Package Deployment: Xue-lu small Wine study ExtJS

Snow says

Previously written about the deployment of ExtJS + java. But at that time still do not know how to pack ExtJS program, so the whole ExtJS project uploaded up. The specific process can be seen in my previous blog post.

This time, we will introduce the real way of packaging the release, there are two main processes, one is packaging (described later) another is the Deployment (blog link)

Packaged

Packaging is a file that will extjs the project (here, single-finger, using the official template as a command-line generated project). After processing, only the valid parts remain, the rest are compressed, forming a small compressed package file. It can greatly reduce the load time of the browser.

The process is simple, but requires several steps:

First step: Playing testing package to detect if a dependent component is missing from an abbreviated project .

Open cmd to enter the folder where the project is located. Using commands

Sencha App Build testing

Testing Package for the program (check my previous blog for questions about this)

When this occurs, the package is finished and can be tested.

However, it is important to note that the configuration of Nginx will initially load the entire project file and directory path directed here

Because the entry for the program is index.html, the path must be set to the directory below.

Is my nginx core configuration, of course you need to replace the root directory. I guess I don't have to say more.

Step Two: Run the program

You will find that nothing is loaded and this error will occur:

Uncaught Error: [Ext.createbyalias] Unrecognized alias:interaction.itemhighlight

In general, all I have encountered is this style of error because of the lack of the requires class.

This is where you need to go:

Locate the appropriate class.

Add this class to your project: requires["Ext.chart.interactions.ItemHighlight", and do the first step again.

Step three: Make a production bag

When you complete the second step of missing requires for each page, you need to use

Sencha App Build Production

This command, to be packaged. Since the use of testing is packaged, the JS dependent components running on the ExtJS page are not compressed. The browser will still load a bit more packets. After using production, the dependent JS components are packaged as well.

At this point, the generated

Just adapt to the build under the production folder thing on the line. At this point you can put the contents of this build as the final release file, placed on the server.

If you have any questions, please leave a comment below.

ExtJS Project Package Deployment: Xue-lu small Wine study ExtJS