404s after updating to systemjs-angular-loader.js

Question

I am updating my Angular project and decided to remove all instances of moduleId: module.id, as the docs have instructed me to here: https://angular.io/docs/ts/latest/guide/change-log.html

All mention of moduleId removed. "Component relative paths" cookbook deleted (2017-03-13)

We added a new SystemJS plugin (systemjs-angular-loader.js) to our recommended SystemJS configuration. This plugin dynamically converts "component-relative" paths in templateUrl and styleUrls to "absolute paths" for you.

We strongly encourage you to only write component-relative paths. That is the only form of URL discussed in these docs. You no longer need to write @Component({ moduleId: module.id }), nor should you.

Before removing moduleId: module.id, I did the following steps:

1. Downloaded the systemjs-angular-loader.js file and put it in my src folder (same level as systemjs.config.js)
2. Added loader: 'systemjs-angular-loader.js' to my systemjs.config.js file (tried to paste more code but it wouldn't format for some reason)
3. Updated systemjs version in package.json file: "systemjs": "0.20.12",

After following those steps and removing moduleId: module.id from my component, as the docs clearly say I should do, I got the following error:

GET http://localhost:3000/checklists.component.html 404 (Not Found)

Here is what that component code looks like now:

@Component({    
    selector: 'checklists',
    templateUrl: 'checklists.component.html'    
})

Why am I getting a 404 on my html file? Did I miss a step?