I have generated my app in extjs 6 through sencha cmd. While doing sencha app build, all my js files get concatenated into 1 file(app.js). I want to keep my js folder structure like before to help me in debugging and putting breakpoints. Is there a way we can do that?
- You can always open the uncompiled version of the app in a browser of your choice.Alexander– Alexander2016-07-11 07:27:22 +00:00Commented Jul 11, 2016 at 7:27
- @Alexander How do i do that? whenever I deploy the app without building it, it is looking for files inside the build folder and gives error.AngryLeo– AngryLeo2016-07-12 11:38:19 +00:00Commented Jul 12, 2016 at 11:38
3 Answers
You should do your debugging before you do build. Doing a build is really just that, "compiling" all the js into a single file.
In some cases you need to debug the build code itself, in those cases you can turn of YUI compression, so that you can use break points etc. Then just use the "testing" parameter:
sencha app build testing Then, locate your build in build/testing in stead of build/production. There is also a sencha app build development but it's really just for helpful for building/updating the css bootstrap, and your're better of using sencha app watch for that (since it's constantly monitors and updates if needed)
Comments
Important Sencha commands for development and deployment
sencha app build development It will generate development build.
sencha app build production It will generate production build(single file app.js).
sencha app build testing It will generate testing build.
sencha app watch It will do a refresh and update your extjs file.
sencha app build clean It will do a clean build.
Comments
You can and should debug your ExtJS application without compiling it over and over and over again.
For me, this works as follows:
- I have a server API located at
localhost/api/ - I have the uncompiled ExtJS app located at
localhost/app-dev/, complete with theextsubdirectory. - I have the compiled ExtJS app located at
localhost/app/
On deployment, I would deploy onto a real server
- the api into
server/subdir/api/ - the app into
server/subdir/app/
But debugging is locally. My development computer has that additional app-dev directory that fetches from the same api using the same relative paths, and the uncompiled version always is a fully working version that can be fired up in the browser of your choice.
So if I only change the javascript and want to test, I don't have to wait for a compile - I can reload localhost/app-dev/index.html and there I am. When I believe that there are no bugs in the app-dev version, I then just doubleclick a batch file that produces the compiled version in the app directory.
If I want to test CSS changes, I have to compile first, because Sencha Cmd uses SCSS files. This is why the uncompiled version wants to fetch its CSS files from the build directory as well - a browser cannot use the uncompiled CSS. But after compile, the new CSS is also available to the uncompiled version of the app.