Add an option to develop in a reproducible and containerized environment

Dockerfile.develop

@@ -0,0 +1,45 @@
+FROM node:10-alpine
+
+# Support custom branches of the react-sdk and js-sdk. This also helps us build
+# images of riot-web develop.
+ARG USE_CUSTOM_SDKS=false
+ARG REACT_SDK_REPO="https://github.com/matrix-org/matrix-react-sdk.git"
+ARG REACT_SDK_BRANCH="master"
+ARG JS_SDK_REPO="https://github.com/matrix-org/matrix-js-sdk.git"
+ARG JS_SDK_BRANCH="master"
+
+# CRLF -> LF conversion
+RUN apk add --no-cache git dos2unix
+
+WORKDIR /src
+
+# Install deps-only into separate Docker layer and run Riot when the container
+# starts, mount source as a volume and keep dev environment consistent
+COPY scripts /src/scripts
+RUN dos2unix /src/scripts/docker-link-repos.sh \
+    && sh /src/scripts/docker-link-repos.sh
+
+# Cache package.json
+COPY package.json yarn.lock /src/
+
+# Remove 'prepare' script because there is NO config in yarn and npm for
+# disabling it and is not necessary for development build
+RUN sed -i -e '/"prepare":/d' /src/package.json
+RUN yarn --network-timeout=100000 install
+
+# Overlay src files with the original ones in case something was left out
+# from explicit copying above and doesn't work with mounting properly such as:
+#
+# "ERROR in Entry module not found: Error: Can't resolve './src' in '/src'"
+# "ERROR in multi (webpack)-dev-server/client?http://0.0.0.0 ./src"
+COPY . /src
+
+# Assemble entrypoint that copies the config at container start
+# and runs webpack server. Mount volume to /src/src for developing.
+RUN echo 'mkdir /src/webapp' >> /entry.sh \
+    && echo 'cp /src/config.sample.json /src/webapp/config.json' >> /entry.sh \
+    && echo 'yarn start' >> /entry.sh \
+    && chmod +x /entry.sh
+
+# run webpack server to change the code on-the-go
+ENTRYPOINT /entry.sh

README.md

@@ -304,6 +304,43 @@ If any of these steps error with, `file table overflow`, you are probably on a m
 which has a very low limit on max open files. Run `ulimit -Sn 1024` and try again.
 You'll need to do this in each new terminal you open before building Riot.
 
+Using Docker image for development
+----------------------------------
+
+Avoids installation of Node, NPM and the rest of the environment by providing
+the same environment that's used in serving Riot via Dockerfile officially
+and at the same time allows to plug in the folder with source files so that
+you can edit outside of Docker container and let it compile inside where
+it is safely separated from your machine or any custom configuration.
+
+Using this approach provides a reproducible environment between you and
+the maintainers if you share your changes in a pull request.
+
+Run it with:
+
+    # build image
+    docker build --tag vectorim/riot-web:develop --file Dockerfile.develop .
+
+    # remove old container or do nothing
+    docker rm -f riot || true
+
+    # run a new container with src folder mounted from git repository
+    # located on the host machine. You can mount additional folders
+    # such as res with additional --volume $PWD/res:/src/res
+    docker run --detach --interactive --tty \
+        --publish <port-on-host>:8080 \
+        --volume $PWD/src:/src/src \
+        --name riot \
+        vectorim/riot-web:develop
+
+And access ``yarn`` and other commands from inside of the container:
+
+    # run shell process from container
+    docker exec -it riot sh
+
+    # run yarn process from container
+    docker exec -it riot yarn
+
 Running the tests
 -----------------