visual studio code tasks

visual studio code has a nifty, but not well documented feature: tasks.

vscode supports the notion of a task runner where you can run tasks in the IDE. as node friendly as vscode is, there isn’t very good documentation on how to setup tasks for a node-based project.

grunt and gulp are potential and popular task runners in this case, but i think that npm should be the task runner of choice for node-based projects. vscode already parses a node.js’ package.json to derive the debugger start command and npm has a facility to run commands like start and test.

a sample vscode task runner configuration for a node project would look like:

webpack – karma and istanbul code coverage

part of the difficulty of using something like webpack is that the source code that you edit is not the final code that is used in your project. so when it comes to unit testing your code, you have to figure out how to instrument what webpack is bundling.

suppose that you are using karma as your test runner with mocha, chai, and sinon. you can add istanbul to the mix to add code coverage, but you need istanbul to understand how webpack bundles files.

luckily, there’s istanbul-instrumenter-loader. you can add this as a loader which will add the instrumentation of the code in your project as part of the webpack process.

a sample karma.conf.js file:

webpack – exposing jQuery as a global variable

webpack is an incredibly powerful tool, but finding examples of simple things are far and few between. i spent the better part of the day trying to figure out how to include jQuery as part of the global scope. first the sample webpack.config.js file:

in the webpack.config.js file, you need to add a section in resolve and set up an alias (jquery) to the jQuery file. once that’s done, you need to add a line in your entry file to expose jQuery as a global via the expose loader.

in app.js:

in this example, we are running the expose loader plugin twice to bind $ and jQuery to global scope.

also in your project, make sure to include the expose loader via the npm command:

and that’s it! jQuery is now bound to global scope as if you did a call.

webpack – chunk files not found

i’ve started my foray into webpack which appears to be quite promising, but the documentation is overwhelming and not very gentle for the newcomer.

i was trying to figure out how to asynchronously load files with webpack using CommonJS modules. apparently, if you specify an output.path in webpack, you will also need to specify the output.publicPath option so that webpack knows how to find the chunks.

an example working webpack.config.js file:

the big server migration – day 4

doing just a little bit of this migration at a time is starting to wear on me. i’ve decided to hunker down and move everything else over. it is turning out that i just happened to pick the problematic sites to migrate over first because the rest of the migrations are starting to move over quite nicely.

the gallery is the last bit that i was nervous about since it was all custom code written about decade ago, but it seems like PHP hasn’t changed much since then so i’m a-ok. not sure if that’s a good or bad statement about PHP, really. i guess it’s more the problem statement of PHP.

i believe the migration is complete. DNS just needs to propagate and we’re pretty much golden.

i was just thinking that i need to figure out how to do domain-based routing with haproxy so entire domains can be reverse proxied over to node. now i need a VM to play with haproxy configurations since i’ve productionalized my only instance. *sigh*

although, with as cheap as linode is, it may be worth it to just spin up a new linode as my dev server to play with. hmmmmm.

the big server migration – day 3

ugh, i’m sick and restless so after being in bed all day, i decided to get up and apply myself a little with what else? yet another blog migration to the new server.

i think i’m going to try to migrate 1 blog a day and see how that treats me. it seems EVERY blog has a different issue. this time around, there was some issue with one of the themes that i had been using on the old host that made wordpress silently freak out and fail. http 200. blank screen. no PHP errors. no databases issues. it just didn’t want to work. lovely. i am so over wordpress…if only my users were too.

that being said, i was able to migrate another blog over and am just waiting for DNS to propagate before i call it a complete success.

in the mean time, i’ve been toying around with the idea of a new tech stack to do my development work in. something node based, but i think it’s time for me to finally go through my list of technologies that i always wanted to check out, but never really got to:

  • webpack on a node.js stack
  • has koa’s time come yet?
  • is sails.js the way to go?
  • lazo vs. rendr vs. ezel
  • bootstrap 3 vs. foundataion 5 – when will this ever end?
  • gulp
  • can we realistically embrace web components yet?
  • is react + flux or some variant really that good?
  • speaking of flux, the sheer number of variants that have spawned into existence seems to indicate that the gist of flux is right but there are some gaps that other people are trying to fill.

    the big server migration – day 2

    life is moving along a little better. the blogs migration doesn’t look as bad as initially anticipated. i think i’ve successfully migrated the first blog over. i’ve changed the DNS to hit the new server, so we’ll give it a day or so and make sure that nothing wonky is going on. if all looks good, i’ll get to moving the rest of the blogs over this week and see how quickly i can deprecate the old server.

    linode has been pretty impressive so far, i’m quite happy with them. overcast.fm is hosted there and that was enough for me to give them a gamble.

    i’m a little anxious about the reverse proxy with haproxy working with named virtual hosts. it *should* all work at this point, but you just never know. that being said, i’m already thinking about my first node-hosted project should be here. maybe i’ll port the gallery over to node, it’s sad that all of my personal work is so outdated and using technologies from years past.

    i keep forgetting how conservative ubuntu’s package defaults are. apache2 doesn’t have mod_rewrite enabled and it took me a while to remember how ubuntu enables all of these configurations. it’s very modularized and file-based so you just have to add a bunch of soft links, but it makes it hard for me because i’m so used to 1 big config file. i get the value prop of the way ubuntu does it, and i can imagine all of the tooling that you can build around this, so i guess this shows how long i’ve been out of the game.

    the big server migration – day 1

    i’m embarking upon a big server migration moving from a “co-lo” to cloud-based VPS hosted solution. the cloud provider i’m going with is linode. my first attempt at launching an instance of a VM failed and i had to contact their customer support.

    their online customer support migrated me from one box to another and i was up and running quickly thereafter. the CS rep responded to my online support ticket within 30 minutes of opening it, so that seemed pretty good.

    so far, i’m pretty impressed with linode. all of the pain of being a sysadmin, however, is coming back to me and what’s worse is that i’ve decided that i really want to complicate the architecture of my little box…because i can.

    this box largely is responsible for hosting several wordpress blogs, but it’s also home to some personal projects. most of the legacy stuff is all LAMP-based so once i get wordpress working, everything else should hopefully fall into place.

    the one wrinkle in this is that i really want a good playground with some node.js projects i have in the background. i’ve decided to reverse proxy all requests coming into this box with haproxy. nginx is so much simpler to setup for this kind of straightforward proxying, but i really love the admin stats that haproxy provides.

    haproxy is working great now, it always takes me a while to fiddle with it before i get it just right:

    we’ll call it a day there.

    sublime text editor – windows context menu integration

    recently, i’ve been bouncing between a mac and windows dev environment and one of the things that i noticed when i use windows is that i’m not as command line driven as i am when i develop on a mac. it’s almost as if i’m regressing to being a UI-dependent user. one of the things that i find myself doing while in explorer is wishing that i had sublime text editor integration in the context menu. i didn’t install it during the install and missed it.

    turns out someone has already figured out how to add it:
    https://gist.github.com/jcppkkk/8330314