Danlynn Ember Cli Save

ember-cli docker image providing a complete development environment

Project README

ember-cli logo

This image contains everything you need to have a working development environment for ember-cli. The container's working dir is /myapp so that you can setup a volume mapping your project dir to /myapp in the container. (MIT License)

stars pulls automated status MIT License

ember-cli 5.8.1 + node 20.12.2/22.1.0 + npm 10.5.0/10.7.0 + bower 1.8.8 + yarn 1.22.19/1.22.19 + chrome 124.0.6367.118 + watchman 4.9.0

This image was originally based on: geoffreyd/ember-cli (hat tip)

Example Ember Octane app using docker-compose

ember octane quick start guide tutorial

This example runs through the Quick Start ember octane guide tutorial. It follows the Quick Start instructions at ember-cli-docker-compose-template for using the danlynn/ember-cli docker image with docker-compose.

Click here to view the video full-size and with playback controls.

How to use

The absolutely easiest way to use this ember-cli docker image is to use docker-compose. I've put together a git repo that contains a stub ember-cli docker-compose template project that makes this a snap! Full details of the optimized docker-compose environment for developing ember-cli project can be found in that repo's README.

Basically, it creates a new project directory with the following files:

ember-project
  docker-compose.yml
  README-template.md
  bash
  ember
  serve

The docker-compose.yml is configured to use this danlynn/ember-cli docker image from dockerhub and looks like this:

version: '2'

services:
  ember:
    image: danlynn/ember-cli:latest
    volumes:
      - .:/myapp
      - .bash_history:/root/.bash_history
      - node_modules:/myapp/node_modules
    tmpfs:
      - /myapp/tmp
    ports:
      - "4200:4200"
      - "7020:7020"
      - "7357:7357"

volumes:
  node_modules:

The bash, ember, and serve commands are shortcuts for performing the most common ember dev tasks.

Quick start instructions:

Copy and run the following 3 lines in your terminal to create a new ember app named 'ember-project' and then host it on http://locahost:4200:

$ proj_dir='ember-project' && curl -Ls https://github.com/danlynn/ember-cli-docker-compose-template/archive/master.zip > "$proj_dir.zip" && unzip -qq -j "$proj_dir.zip" -d "$proj_dir" && rm "$proj_dir.zip" && cd "$proj_dir" && mv README.md README-template.md && ls -l
$ ./ember init
$ ./serve

Replace the "ember-project" at the beginning with the name to use for the new project dir. This first line will create a new directory named "ember-project" populated with the contents of the ember-cli-docker-compose-template repo from github then cd into that directory ready to use. The last 2 lines are common commands that use the 'shortcuts' to run the ember command in the container and then start the ember server.

Slightly more detailed instructions:

More detailed usage instructions can be found in the ember-cli docker-compose template repo README.

Straight docker usage

You can ignore docker-compose completely and simply use straight docker commands to interact with your ember project in the container.

Command Usage for docker run

Basically put docker run --rm -ti -v $(pwd):/myapp danlynn/ember-cli:5.8.1 before any command you run.

Example:

$ docker run --rm -ti -v $(pwd):/myapp danlynn/ember-cli:5.8.1 npm install
$ docker run --rm -ti -v $(pwd):/myapp danlynn/ember-cli:5.8.1 bower --allow-root install bootstrap
$ docker run --rm -ti -v $(pwd):/myapp danlynn/ember-cli:5.8.1 ember generate model user
$ docker run --rm -ti -v $(pwd):/myapp -p 4200:4200 -p 7020:7020 -p 7357:7357 danlynn/ember-cli:5.8.1

Note that the --rm prevents a bunch of stopped containers from accumulating from these one-off commands. They take up space and since pretty much any change made by these commands will only affect what is in your project dir (/myapp in the container), there is no need to keep them around.

Launching bash shell then running commands directly

You could simply launch into a bash shell and execute the commands in the normal fashion:

$ mkdir new_ember_app
$ cd new_ember_app
$ docker run --rm -it -v $(pwd):/myapp -p 4200:4200 -p 7020:7020 -p 7357:7357 danlynn/ember-cli:5.8.1 bash

root@9ad4805d2b50:/myapp# ember init
root@9ad4805d2b50:/myapp# ember init --yarn
root@9ad4805d2b50:/myapp# npm install
root@9ad4805d2b50:/myapp# bower --allow-root install
root@9ad4805d2b50:/myapp# ember server
root@9ad4805d2b50:/myapp# ember test
root@9ad4805d2b50:/myapp# ember test --server

Note that bash had to be launched with -p 4200:4200 -p 7020:7020 in order to be able to access the ember server on port 4200 and enable Livereload on port 7020. The -p 7357:7357 is needed if you intend to run ember test --server.

Also note that the npm install is done automagically by the ember init command on newer versions of ember. Also, bower --allow-root install is not used as much anymore. There are no bower packages or dependencies in the default project created by ember init. Using the --yarn option on ember init --yarn will use yarn instead of npm to install dependencies.

Also note that both npm and bower are pretty much being replaced by yarn. Newer versions of ember-cli have built-in support for yarn on many commands. Yarn works smoothly in place of npm. Yarn can also replace your use of bower. However, even though yarn used to support bower file formats directly, it no longer does. You should instead use yarn's support for installing front-end web components.

Troubleshooting

  • Watchman watch limit error

    While the ember-cli server is running in the docker container, it will detect changes to the ember webapp files. These changes will automagically be detected and the associated files will be recompiled and the browser will auto-reload showing the changes.

    Note, however, that if you get an error something like:

    ember_1 | Error: A non-recoverable condition has triggered.  Watchman needs your help!
ember_1 | The triggering condition was at timestamp=1450119416: inotify-add-watch(/myapp/node_modules/ember-cli/node_modules/bower/node_modules/update-notifier/node_modules/latest-version/node_modules/package-json/node_modules/got/node_modules/duplexify/node_modules/readable-stream/doc) -> The user limit on the total number of inotify watches was reached; increase the fs.inotify.max_user_watches sysctl
ember_1 | All requests will continue to fail with this message until you resolve
ember_1 | the underlying problem.  You will find more information on fixing this at
ember_1 | https://facebook.github.io/watchman/docs/troubleshooting.html#poison-inotify-add-watch

    This means that watchman is running out of resources trying to track all the files in a large ember app. To increase the fs.inotify.max_user_watches count to something that is more appropriate for an ember app, stop your docker-compose server by hitting ctrl-c (or docker-compose stop server if necessary) then execute the following command:

    $ docker run --rm --privileged danlynn/ember-cli:3.7.1 sysctl -w fs.inotify.max_user_watches=524288

    Note that this will affect all containers that run on the current docker-machine from this point forward because fs.inotify.max_user_watches is a system-wide setting. This shouldn't be a big deal however, so go ahead and give it a try. Then start the docker-compose service again with

    $ docker-compose up

  • Ember build system crashing

    Some IDEs (Intelli-J) have features that can wreak havoc with the build system. If the IDE quickly writes temp files into the project tree then deletes them before or while the Ember build system is processing the changes then the build system can crash.

    When this happens, you will see something like the following in the build console:

    ember_1  | file deleted templates/application.hbs___jb_old___
ember_1  | file deleted templates/application.hbs___jb_tmp___
ember_1  | file changed templates/application.hbs
ember_1  | Cannot find module 'broccoli/package'
ember_1  | 
ember_1  | 
ember_1  | Stack Trace and Error Report: /tmp/error.dump.644b7ae2dd9e56d5eef7b92b898c1235.log
ember_1  | TypeError: Cannot read property 'broccoliNode' of undefined

    The fix is to change your IDE's settings in order to avoid this behavior. For Intelli-J IDEs, it is the "safe write" feature that causes additional transient files to be generated and quickly deleted upon every save. This feature can be turned OFF without affecting IDE behavior by going to Settings > Appearance & Behavior > System Settings and then unchecking the 'Use "safe write" (save changes to a temporary file first)' checkbox. After turning this feature OFF, you can make changes to your files and the ember build system will pick them up and perform builds without further issue.

Open Source Agenda is not affiliated with "Danlynn Ember Cli" Project. README Source: danlynn/ember-cli
Stars
100
Open Issues
17
Last Commit
1 week ago
Repository
danlynn/ember-cli
License
MIT
Homepage
https://hub.docker.com/r/danlynn/ember-cli/
Tags
Docker Dockerfile Ember Cli

Open Source Agenda Badge

Open Source Agenda Rating
Submit Review Review Your Favorite Project
Submit Resource Articles, Courses, Videos
Submit Article Submit a post to our blog

From the blog

Dec 11, 2022

How to Choose Which Programming Language to Learn First?

From the blog

Dec 11, 2022

How to Choose Which Programming Language to Learn First?