What are the steps to compile Sencha Touch using sencha-touch.jsb3?

I've been working on modifying the bundled sencha-touch.jsb3 file in an effort to decrease the size of the framework code.

Here's what I've done so far:

  1. First, I downloaded the Sencha SDK Tools from

  2. I then made edits to SenchaTouch/sencha-touch.jsb3. Specifically, I made changes to:

    ...
"builds": [
  {
    ...
    "debug": true,
    ...

    and updated it to:

    ...
"builds": [
  {
    ...
    "debug": false,
    "compress": true,
    ...

  3. Next, I ran the command 

    sencha build -p path/to/sencha-touch.jsb3 -d path/to/result/

The sencha-touch.js file was successfully built, maintaining comments, white spaces, and other formatting. However, during the "Compress and obfuscate sencha-touch.js" step, the compression tool (yuicompressor) flagged syntax errors and refused to minify the file.

If you have encountered and resolved this issue before, your insights and experiences would be greatly appreciated if shared here.

javascriptsencha-touchextjsyui-compressor

Answer №1

My current setup involves using JSBuilder to create a single file and then utilizing ycompressor for compressing the js file.

Feel free to use my one-click batch file provided below:

cd C:\wamp\www\sencha-touch-1.1.1\jsbuilder
CALL JSBuilder.bat -v -p "C:\wamp\www\my-sencha-project\mobile_app_deploy.jsb3" -d "C:\wamp\www\my-sencha-project\"

java -jar ycompressor\ycompressor.jar --charset utf8 -o C:\wamp\www\sencha-touch-1.1.1\jsbuilder\my-sencha-project-mini.js --nomunge  C:\wamp\www\sencha-touch-1.1.1\jsbuilder\ybapp.js

xcopy ybapp.js c:\wamp\www\my-sencha-project\js /y
xcopy ybapp-mini.js c:\wamp\www\my-sencha-project\js\ /y
pause

*The mobile_app_deploy.jsb3 in this script includes the original sencha-touch.jsb3, as well as any additional js files specific to my sencha app.

I hope this solution proves helpful to you and others who come across it.

(ps. perhaps a jsb3 tag could be beneficial)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

I keep encountering an issue with getJson

A snippet of my JavaScript code retrieves a JSON object from a URL. Here is the portion of the code in question: <script> $(document).ready(function(){ $("button").click(function(){ $.getJSON('url_address', {}, function(data) { ...

javascriptjqueryhtmljson

Passing the value in a td element to a JavaScript function using Thymeleaf onClick

Trying to utilize "Thymeleaf" for the first time, I am attempting to pass a value to JavaScript with the following code: onclick="getPropId('${properties.id}')" The corresponding function is as follows: getPropId(inputID){alert(inputId);} Unf ...

javascriptjavajqueryhtmlthymeleaf

Learn how to implement pagination in AngularJS using the $http service

I need assistance in implementing pagination using Angularjs within the Ionic Framework. Can someone provide guidance on how to code pagination for fetching data from a JSON URL? controller.js angular.module('starter.controllers', []) .control ...

javascriptangularjs

Allowing input fields to accept decimal numbers

I am currently facing an issue with an input field that is set to type=number, which does not allow for decimal numbers. However, I need to enable users to input decimal numbers but haven't been able to make it work. Would using regex be a possible so ...

javascriptreactjs

Is it possible to combine JavaScript objects using TypeScript?

Currently, I am dealing with two objects: First Object - A { key1 : 'key1', key2 : 'key2' } Second Object - B { key1 : 'override a' } I am looking to combine them to create the following result: The Merged Re ...

javascripttypescript

Conceal/reveal specific sections of a table cell using jQuery

Here is a table I have: A header Another header First (some-text-initially-hidden) click row Upon clicking, it changes to: A header Another header First (some-text-should-be visible now) click row However, the text "some-text-initially-hi ...

javascripthtmljquerycsshtml-table

A step-by-step guide on enhancing error message handling for Reactive forms in Angular

Here is a code snippet that I'm working on: public errorMessages; ngOnInit(): void { this.startErrorMessage(); } private startErrorMessage() { this.errorMessages = maxLength: this.translate.instant(' ...

javascriptangulartypescriptformsangular-reactive-forms

Mist Conceals Celestial View (THREE.JS R76)

I have a cylindrical camera setup with fog to hide the end of the tube. However, I am trying to make the skybox visible through the alpha map sides of the cylinder. The current issue is that the fog is blocking the visibility and I'm looking for a sol ...

javascriptthree.jsskybox

The useNavigate() hook from react-router-dom is not properly setting the id in the URL path

I am currently using react-router-dom v6 for my routing needs. My goal is to pass an ID in the navigate URL path. Here is the onClick method and button code that I am working with: let navigate = useNavigate(); const routeChange = (id) => { let ...

javascriptreactjsnavigationreact-router-dom

Breadcrumb navigation that is determined by data hierarchies and relationships between parent and child items

I am looking to implement a dynamic breadcrumb system on my website using data-driven methodology. The necessary data is stored in a MariaDB database and has the following structure: parent_id | parent_name | child_id | child_name ——————— ...

javascriptphpmysqld3.jsmariadb

Creating a JavaScript file to incorporate into an HTML document

I stumbled upon this code snippet here This code allows me to fetch data from a php file and insert it into a div using jQuery. While the tutorial works perfectly, I'm planning to use this for about 9-10 different links and thought of consolidating a ...

phpjavascriptjqueryhtmlhyperlink

Python Selenium- Extract and print text from a dynamic list within a scrolling dropdown element

I am currently working on a project using Selenium and Python to extract a list of company names from a dropdown menu on a javascript-driven webpage. I have successfully managed to reveal the list of company names by clicking the navigation button, and eve ...

javascriptjquerypythoncssselenium

Enhancing the content of a field - React

Seeking assistance with populating an input field with a generated password in my React component. Currently, the password is showing as undefined. MainComponent.js - primary React component class MainComponent extends React.Component { state = { p ...

javascriptreactjs

Tips on accessing information from a JSON file

I am facing an issue while trying to extract data from a JSON object that was passed from the servlet. The keys in my JSON object are numbered, and I need to append these numbers to the names of the keys. The structure of my response is as follows: {"sha ...

javascriptjqueryjson

React - Parent Component not successfully passing Ajax data to Child Component

I have a parent component and a child component. I am using the fetch method within the componentDidMount() callback to retrieve data from an API and then set the state with key items to that data. The intention is for this data to be passed down to the ch ...

javascriptreactjs

The issue with Express connect-flash only showing after a page refresh instead of instantly displaying on the same page needs to be addressed

Here is the registration route code snippet: router.post("/register", function(req, res){ var newUser = new User({username: req.body.username}); User.register(newUser, req.body.password, function(error, user){ if(error){ req.fl ...

javascriptnode.jsmongodbexpressconnect-flash

Custom attribute in ReactJS component - I am not defined in my custom attribute in React component

I am currently working with ReactJS and I am facing an issue regarding accessing a custom attribute -name- of my ReactJS component. Despite trying to use e.target.name, it keeps returning "undefined" on my console. I cannot seem to figure out why this is ...

javascriptreactjs

Using async functions with Vue.js

In my Vue.js component, I have the following code snippet: module.exports = { data: function () { return { searchText: "", searchResult: [] } }, watch: { searchText: function() { ...

javascriptvue.js

Expo + tRPC: Oops! Looks like the application context couldn't be retrieved. Don't forget to wrap your App inside the `withTRPC` HoC for

I'm currently working on a straightforward tRPC server setup: // server.ts import { initTRPC } from "@trpc/server"; import { z } from "zod"; const t = initTRPC.create(); export const appRouter = t.router({ greeting: t.procedu ...

javascripttypescriptreact-nativeexpotrpc.io

Utilizing the HTML5 Download attribute for linking to external files

I am currently developing a web application for my own personal needs. One feature I would like to implement is the ability to set the download attribute on certain links. However, I have run into an issue where the files to be downloaded are hosted on ex ...

javascripthtmlcross-domaingreasemonkey