I am working with sencha touch 2 in MVC format. I have created a cache.manifest file to bring my app offline.
CACHE MANIFEST
index.html
app.js
guide.css
app/model/Contact.js
app/model/Injury.js
app/view/IncidentForm.js
app/view/Home.js
app/view/DivisionSelect.js
app/view/InjuryResponse.js
app/view/EmergencyContact.js
app/controller/Core.js
i/amcor-app-bg#2.png
i/amcor-bg-logo#2.png
i/amcor-logo.png
i/amcor-tb-logo2x.png
i/arrow_right.png
i/ec-icon#2.png
i/home_icon.png
i/in-icon#2.png
i/ir-icon2x.png
i/ir-icon#2.png
i/ir-toolbar-bg2x.png
st2/builds/sencha-touch-all-compat.js
st2/resources/css/sencha-touch.css
NETWORK:
*
My issue is that the cache.manifest file does not seem to recognize any of my js files except for app.js. When I am working online it seems to cache properly but when I go offline the cache only returns index.html, app.js, and the sencha files. Can the cache.manifest file only have one .js file?
You should really try to use the tools SDK then you don't have to worry at all.
The Microloader helps keep things up to date.
Its a bit light on its error checking output and you must conform to the MVC app layout created by the SDK tools but once its running "it just works".
If the "compile" hangs its probably a missing ref.
Related
I'm trying to follow the Compose Multiplatform Web Getting Started guide. Most of it seems to work fine, but when I try to actually run the thing (gradle jsBrowserRun), it starts a browser, but it can't find the generated JavaScript file. The browser console shows a 404 for GET http://localhost:8080/kotlin-multi-web.js.
The file kotlin-multi-web.js is indeed the name of a file generated in web/build/compileSync/main/developmentExecutable/kotlin.
The page title matches the one I defined in my index.html, so that gets loaded correctly.
I have tried a pure Compose Web project (which isn't a Gradle multi module project), and there it does all load correctly. I checked, and didn't see any differences between the Gradle build files other than the extra dependency from the web project on common.
So, why doesn't it load, and how can I fix it?
I have developed a vue application and did run npm run build
After that I uploaded the content in the dist file to my webpage but it returned a blank page.
Since I did this for testing I uploaded it to a folder in my public_html/mypage.com/vueapplication To get all the paths right I added a vue.config.js with this content:
// vue.config.js
module.exports = {
publicPath: '/vueapplication/'
}
The application now works but I wounder however:
how do I best publish/upload the application to my site? Just by simply dragging the content inte the right folder?
how can I best maintain my site? Do I need to build again and upload, overwriting my files when everytime I make an update on my site?
And what is the difference between build and deploy your application?
Drag and dropping your code should work. But as your app grows you may want to look into automating this. For instance if you use an S3 bucket you can use the aws cli to automate the upload.
Yes, you should overwrite your deploy folder(s). You need to also take care of deploying different binary files, that have the same name. An example is if you have a global css file (main.css for instance). The file will probably change content between deployments, but keep the same name. Browsers may cache the file so users that downloaded older versions of the file will not use the new one. There are different techniques to handle this, but if you use webpack, it uses cache busting techniques and you should be fine.
Build is the process of transforming source code into an artifact(s). Exactly what this means differs from language to language, platform to platform. In the vuejs world this usually means a couple of js files, a couple of css files and some assets.
Deploying means taking the output of a build and making it available to your users. Again this differs from project to project. In the vuejs world this usually means taking the artifacts from the build and uploading them to an http enabled web server.
I am a semi noob in web development.
I just started playing around with angular2 today. And i ran into a problem..
If I were to install angular2 with npm to my local computer, which file is the js file that should be linked to the html page that show up on the client?
In their guide, i see a file called /node_modules/angular2/bundles/angular2.sfx.dev.js. But i don't even see this file at all.
Is there some script that i should run to build that file? Or is the file renamed? I am really confused.
I tried some file /angular2/bundles/angular2.js, but it doesn't even export ng variable to window!
I see that in https://code.angularjs.org/2.0.0-alpha.44/angular2.sfx.dev.js, eventually ng gets exported. But what changed in alpha 53? (the version i get for doing npm install angular2)
In my projects, I a using
"node_modules/angular2/bundles/angular2.dev.js"
You might additionally need to install/add systemjs, just in case you are using the systemjs library.
I am trying to use Aurelia bundle --force command with an Aurelia app hosted within a page of my MVC application.
When i try to run the command, I keep getting the following error:
info: Creating bundle ...
fs.js:549
return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode);
Error: ENOENT: no such file or directory, open 'C:\Users\...\WebFrontend\index.html'
How do you change the location where aurelia bundle looks up for the index.html? My index.html is not in the root of the website. Furthermore, my aurelia 'index.html' is actually named settings.cshtml
UPDATE:
I finally got it working by putting my entire Aurelia app within a sub folder of my MVC app. Using post build events in my project, I got Aurelia-CLI to bundle my app. Within my setting.cshtml, I basically just reference the config.js and system.js.
This works great, but I need to rebuild the app each time I make a change which is not ideal. Still need to figure this one out.
Steve Sanderson made a template for Aurelia (that is no longer supported by Microsoft). https://blogs.msdn.microsoft.com/webdev/2017/02/14/building-single-page-applications-on-asp-net-core-with-javascriptservices/
You can also use the Aureali cli to create one.
This should work better now then in 2015.
Still not clear with this. I am testing with simple login form (Version is 2.2.1 and no external CSS or JS). After looking up the resource consuming, I am confused with js should i prefer either (sencha-touch.js or sencha-touch-all.js) for development and production. By default the microloader maps to sencha-touch.js. Should i change it?
sencha-touch.js -->
sencha-touch-all.js -->
Here it just give only 29 hits to server but downloading 4 mb of file which is larger than sencha-touch
sencha-touch.js will be making a request to individual source files for each component your app requires in. sencha-toucha-all.js includes all components by default.
See this guide in the docs for more info:
http://docs.sencha.com/touch/2.3.0/#!/guide/building
More specifically, this is what you should be doing:
- use sencha-touch.js in development
- have each of your files require in all the sencha touch components/proxies etc it needs
- when you want to go to production, use the sencha app build command in your terminal to build to a single, minified javascript file which then contains all your code and all the sencha touch code your app needs.