JSPM bundle doesn't load HTML files - html

I'm using jspm bundle command to bundle up all of my third-party libs.
jspm bundle app.js - [**/*] ./scripts/bundles/vendor.js --inject --minify
The bundle is created as expected.
For some reason when using the bundle my HTML stopped being loaded and I have no idea why.
In my config file I configured that all HTML files are to be loaded using the text plugin
meta: {"*.html": {loader: "text"}}
When using depcache option (without the bundle) or removing the bundle from the config file everything works fine.
The text plugin is in the bundle as well.
I'm using jspm v0.16.45

I found out the reason this was happening, when bundling the text plugin the call for the HTML files comes before the plugin was loaded as part of the bundle.
just needed to take it out of there.

Related

I installed Sass, but it is not properly displaying in project

So I installed Sass for my project via the CLI npm install -g sass but the CSS that I entered is not displaying. So after creating my style.scss file and entering my code, I compiled it using live sass compiler. As a result, the style.css and style.css.map files appeared (like they should). I then went into my html file and imported it.
Am I importing my CSS file correctly into my HTML file? If you see below, I thought this how it should be done. I am not using any framework for this particular project.
Not sure what to be looking out for when issues like this arise, so any leads are appreciated.
My HTML file
My SASS file

which files are the ones I should upload to a host

I learned to do a working environment based bower, from there install yoeman and gulp and materialize, I made a web page to root of all this, now I want to upload a host (like 000webhost or firebase) but I do not know which files are the ones I should upload
thx
You should upload everything except bower_components directory since it's content is used only when you compile down the things using gulp on your local machine. Once all your source files are piped through gulp, they are not required on the destination location. None of those files is or should be used during a http request.
I don't know exactly what is your project's structure, but because you specified what you use (bower, gulp) then I can deduct.
So after gulp finishes it's work, you have a public directory where all your combined, minified and copied assets live. This is obviously needed on the server, in your markup, you should refer to those files, not the ones fetched by bower when you've done bower install library1 --save. bower install library2 --save.

Incorporating gulp to compile js in apostrophe?

Has anyone rolled gulp into apostrophe for compiling assets? I'd like to use ES6, as I'm using a frontend framework that has all of the js nicely split up into separate assets, and have the compilation of that into one minified file part of the normal apostrophe build process (I'm using apostrophe-assets to reference a single root js file which imports everything else).
Great question. You're going to want to build your JavaScript with Gulp into one file before pushing that file to the browser using Apostrophe's asset pipeline.
For example you might have a /src directory at the root of your project that has your JavaScript files. You can pipe these files into your apostrophe-assets directory or some other named directory that is a subclass of apostrophe-module in /lib/modules/.
You can then push your compiled file to the browser as usual: http://apostrophecms.org/docs/tutorials/getting-started/pushing-assets.html#configuring-java-script-for-the-browser

index.js has no imports and no systemjs config is created

I just created a new Angular project with ng new some-name, but the created index.html contains no <script> tags and no SystemJS configuration is created.
Is this the correct behavior? I would expect the CLI to create a simple running project.
Yes, that is expected behavior. Webpack is used internally in the cli, which by itself injects all the needed script and style tags dynamically when serving/building.
Run ng serve and see that it should serve successfully (locahost:4200).

Disable aurelia-bundler just on dev machine?

I've been working on an Aurelia app without gulp and it has gone well. Now I want to use gulp b/c the page loads are terrible with 100+ separate files being requested. I install aurelia-bundler from the skeleton and can get it working using gulp. But there are two problems:
1. I have to gulp bundle after EVERY change to refresh the page
2. The error messages make no sense b/c everything is minified now.
I can deal with #1 b/c of gulp-watch (even though that still takes time), but I can't handle the minified files and not being able to debug my code.
So, is there and easy way to switch back to the non-bundled files for development on my machine and only use the bundled files when I deploy to Heroku server? It seems like aurelia-bundle now points to the dist folder by default.
Oh yeah, I tried modifying config.js to point to "src" instead of "dist" but it still looks for the aurelia-xxx.js file instead of the non-bundled files.
Thanks.
If you are using the latest build files you can gulp watch in dev which should use the src files without bundling - of course, this is slower, but in conjunction with browser-sync you shouldn't have to do loads of refreshes.
Check your paths.js and other config files against the skeleton if gulp watch is also bundling.