Use node-sass with docker-compose

Question

I'm currently doing my first steps with docker and trying to use docker-compose to run my application:

Node-Backend: hapi
JS-Frontend: angular
MongoDB database

The mongodb in combination with docker works justfine. I'm developing on an OSX machine and using node-sass for the frontend part. When composing there is an error:

server_1  |     Child extract-text-webpack-plugin:
server_1  |       + 1 hidden modules
server_1  |     
server_1  |     ERROR in Missing binding /app/node_modules/node-sass/vendor/linux-x64-48/binding.node
server_1  |     Node Sass could not find a binding for your current environment: Linux 64-bit with Node.js 6.x
server_1  |     
server_1  |     Found bindings for the following environments:
server_1  |       - OS X 64-bit with Node.js 6.x
server_1  |     
server_1  |     This usually happens because your environment has changed since running `npm install`.
server_1  |     Run `npm rebuild node-sass` to build the binding for your current environment.

The node-sass module seems to need linux bindings but just has osx bindings inside the container. So the question is: Is there a smart way to solve this issue so that even the dev process is still comfortable?

So far I don't have any Dockerfile. But my docker-compose.yml looks like:

version: '2'
services:
  server:
    image: node:6
    command: 'npm start'
    working_dir: '/app'
    volumes:
      - ./:/app
    depends_on:
      - mongo
    ports:
      - '1337:1337'
    environment:
      - NODE_ENV=prod
    links:
      - mongo:mongodb
  mongo:
    image: mongo:latest
    ports:
      - '127.0.0.1:27017:27017'
    volumes:
      - ./data/:/data/db

And the package.json:

...

  "dependencies": {
    "accepts": "^1.3.3",
    "akaya": "^0.3.0",
    "angular": "^1.5.8",
    "angular-ui-router": "next",
    "bcrypt": "^0.8.7",
    "blipp": "^2.3.0",
    "boom": "^4.2.0",
    "emojilib": "^2.0.2",
    "emojione": "^2.2.6",
    "glue": "^4.0.0",
    "good": "^7.0.2",
    "good-console": "^6.1.2",
    "good-file": "^6.0.1",
    "good-squeeze": "^5.0.0",
    "hapi": "^15.2.0",
    "hapi-auth-basic": "^4.2.0",
    "hapi-auth-jwt2": "^7.1.3",
    "inert": "^4.0.2",
    "joi": "^9.2.0",
    "jquery": "^3.1.1",
    "jsonwebtoken": "^7.1.9",
    "lodash": "^4.16.4",
    "mongoose": "^4.6.4",
    "pm2": "^2.0.18",
    "twemoji": "^2.2.0",
    "wurst": "^0.9.1"
  },
  "devDependencies": {
    "autoprefixer": "^6.5.1",
    "babel-cli": "^6.16.0",
    "babel-core": "^6.17.0",
    "babel-eslint": "^7.0.0",
    "babel-loader": "^6.2.5",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-preset-es2015": "^6.16.0",
    "babel-preset-stage-0": "^6.16.0",
    "baggage-loader": "^0.2.4",
    "chokidar": "^1.6.1",
    "clean-webpack-plugin": "^0.1.13",
    "copy-webpack-plugin": "^3.0.1",
    "css-loader": "^0.25.0",
    "eslint": "^3.8.1",
    "eslint-config-airbnb-base": "^9.0.0",
    "eslint-loader": "^1.6.0",
    "eslint-plugin-import": "^2.0.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "file-loader": "^0.9.0",
    "html-loader": "^0.4.4",
    "html-webpack-plugin": "^2.24.0",
    "inline-style-prefix-all": "^2.0.2",
    "json-loader": "^0.5.4",
    "ng-annotate-loader": "^0.2.0",
    "ngtemplate-loader": "^1.3.1",
    "node-sass": "^3.10.1",
    "postcss-loader": "^1.0.0",
    "sass-loader": "^4.0.2",
    "style-loader": "^0.13.1",
    "url-loader": "^0.5.7",
    "webpack": "^1.13.2",
    "webpack-livereload-plugin": "^0.9.0",
    "webpack-manifest-plugin": "^1.1.0",
    "webpack-md5-hash": "^0.0.5"
  },
  "engines": {
    "node": "6.0.0",
    "npm": "^3.8.8"
  }

Thanks!!

edit: my local directory ./ gets mounted to the container, so my OSX bound modules get also mounted. Is there a smart way to do a new npm i inside the container without any bigger restrictions to the development process?

Answer 1

You need to run npm rebuild node-sass inside the container. You're mounting a binary compiled for OSX and trying to run on Linux.

Answer 2

This may be old news, but in case anyone else runs into this...

Run npm install inside your container (to build the binding for the environment your container runs in)

Then copy the binding from node_modules/node-sass/vendor/ into the dev environment.

I do this on a Mac for the dev env but a node:alpine for the running container.