Hey @dchan38098,
Okay yeap, that’s what I figured. So the first thing to do is like you said, transition to ember-cli with your 1.8 app.
Here’s how I would approach it. Start a new app from scratch (ember init). Once it’s built, go into your package.json and bower.json files and update them accordingly to match the dependences of your existing app. Then rerun npm install and bower install.
A few notes about this, some of the packages in the package.json will relate to ember at runtime (ie ember-data) and some of the packages will relate to ember at buildtime (ie ember-cli-htmlbars). I was looking through the CHANGELOG.md and it seems ember-cli version 0.1.3 was the version that “by default” supported Ember 1.8.1. So even though that version is quite old, you might want to start with that as your npm global version.
Honestly I don’t know if that will cause more headaches or save you some headaches, but it’s what I would try. Reason being is if you use Ember-CLI 1.13.13 right out of the box, it’ll come with addons like HTMLBars and others that might not be compatible with your old version, it’s really hard to say.
Maybe one of the Ember-CLI experts can weigh in on this.
At either rate, once you’ve got the shell of your new ember cli app up and running, it’s time to start bringing in your existing files. This can be kind of tricky. Here is the best way to approach this. Create a folder called “legacy-app” in your “app/” directory. Copy ALL of the files from your app, into that direction
Next create an initializer called “global-imports” (see initializers). In that file you should import every single one of the files in your legacy-app in the proper order. This will ensure that all of your existing global classes end up globally accessible. This is temporary until you’ve migrated fully to ember-cli.
Then you will create “stubbed” files in the proper ES6 directories that match all of the files in your legacy directory. For example:
// app/controllers/user.js
import Ember from 'ember';
export window.App.UserController;
The idea here is that you’ll shim in ES6 path based files around your old app. Once your app is all functioning with this approach, you’ll begin to refactor one controller/view/route at a time. Moving them from the “legacy-app” directory into the proper ES6 location and removing all global usages that exist (eg App.helperFunc()).
Lastly, you can probably just put your CSS/SASS/LESS files in “app/styles” directory and your Handlebars files into the “app/templates” directory with little effort. The templates should just work, you may have to move them around into the proper subdirectories to get them to lookup right. But this shouldn’t take much effort.
This whole thing will take time and there will be unforeseeable hiccups. But I have heard success stories of people using this approach.
**Disclaimer: I don’t know if this is the official upgrade strategy. I don’t know if there is even an official way to do it. Quite frankly ember really falls flat at helping people who get behind. Others may have thoughts on how properly convert from globals to es6 path based.
Edit: This is all what I would call “Stage 1” of your upgrade. It’s important to fully convert to an ember-cli app before attempting to upgrade ember.
