Npm ‘Dev’ Watchify/Browserify/vueify cmd to compile Vue component and start Express server fails? (server fails to start)

Question

I’m following a tutorial https://mindthecode.com/using-vue-components-in-your-express-app/ to use vue components with Express.

Part of that is configuring an npm dev script to compile the vue component with Browserify/vueify, start Watchify, then start the Express Server.

Every step of the turorial worked but the ‘dev’ script doesn't work 100% as the express server doesn't start.

Can anyone help figure how what is wrong or what I need to do to get that script working?

Package.json

"scripts": {
    "start": "echo 'server starting on port 3000' & node ./bin/www",    
    "dev": "watchify -vd -p browserify-hmr -t vueify -e public/javascripts/main.js -o public/javascripts/bundle.js & node ./bin/www"
  },

‘npm run dev’ compiles the vue component and starts watchify and the hot reload works if I change the vue component code. HOWEVER, the express server fails to start?

Note:

browserify -t vueify -e public/javascripts/main.js -o public/javascripts/bundle.js – works fine at the command line to compile the .vue files

npm start – works fine and can load page at ‘localhost:3000’

I'm using windows10, node v8.9.4 and some of the relevant dependencies from package.json

"browserify-hmr": "^0.3.5",
"express": "~4.14.0",
"vue": "^2.5.0",
"vueify": "^9.4.1",
"watchify": "^3.9.0"

Answer 1

You can see completed package.json and full repo from this tutorial

https://github.com/Hyra/vue-components-in-express/blob/master/package.json

{
  "name": "vue-components-in-express",
  "version": "0.0.1",
  "private": false,
  "description": "Sample code to support blog post 'Using Vue Components in your Express app' at https://mindthecode.com/using-vue-components-in-your-express-app/",
  "author": "Stef van den Ham <[email protected]>",
  "scripts": {
    "start": "node ./bin/www",
    "dev": "watchify -vd -p browserify-hmr -t vueify -e public/javascripts/main.js -o public/javascripts/bundle.js & node ./bin/www"
  },
  "dependencies": {
    "body-parser": "~1.15.2",
    "browserify-hmr": "^0.3.5",
    "cookie-parser": "~1.4.3",
    "debug": "~2.2.0",
    "express": "~4.14.0",
    "morgan": "~1.7.0",
    "node-sass": "^4.5.3",
    "pug": "~2.0.0-beta6",
    "serve-favicon": "~2.3.0",
    "vue": "^2.5.0",
    "vueify": "^9.4.1",
    "watchify": "^3.9.0"
  }
}