Assets and dependencies

Here are the most common places:

• Every Ember app has a file called package.json that lists node modules used by the app. The code itself goes in node_modules during npm install, just like in many non-Ember JavaScript projects
• The vendor directory, which is a common home for third-party JavaScript that is copied and pasted in
• The public directory, the typical place for assets like images
• The styles directory, for stylesheets like CSS, SASS, or LESS plus folders like vendor and public that can hold many other files of the developer's choice

Ember CLI supports npm, Yarn, and pnpm for node modules management.

By default, new apps use npm. Both tools offer similar functionality, and which one to choose is up to the developer's preference. Dependencies listed in package.json can be installed with npm install, yarn install, or pnpm install. The files for those packages are added to the node_modules folder of the app.

There are two ways to switch from the default package manager, npm. Either include an option when the app is created, like ember new --yarn or ember new --pnpm, or run yarn install or pnpm install to generate the package manager's associated lockfile file. Ember will detect the lockfile and start using it instead for any ember install some-addon-name commands. Don't forget to delete the package-lock.json file if the app already has one. In cases where both a yarn.lock file and a package-lock.json file are present, Ember CLI will default to using Yarn. However, having both files causes confusion for collaborators and is incompatible with some CI systems.

To switch back to npm, delete the lockfile from your package manager and run npm install to generate a package-lock.json.

To have Ember CLI use yarn or pnpm by default for all new projects, create a .ember-cli file in your home directory with:

{
  "yarn": true
}

or

{
  "pnpm": true
}

Further documentation about npm and Yarn is available at their official documentation pages:

• npm
• pnpm
• Yarn

New apps list the node_modules directory in the app's .gitignore configuration, meaning that any changes to the contents of the directory are ignored by git. Using the npm configuration files allows collaborators to download your app source code and get the node_modules installed locally by executing npm install themselves.

When an app is being served locally, the Ember CLI will not watch for changes in the package.json file. Therefore, if you install npm dependencies via npm install <dependencies>, you will need to restart your Ember CLI server session manually.

Dependencies installed with ember install some-addon-name will cause a refresh of a local server.

Errors such as "a module named _____ could not be found" or a colleague's report that "well, the app works on my computer but not yours!" sometimes indicate that the local server needs to be restarted or node_modules should be reinstalled.

To overcome issues like this visit the CLI Debugging Guide.