{
"name": "bookingevents",
"version": "1.0.0",
"description": "",
"main": "./src/index.ts",
"scripts": {
"postinstall": "tsc",
"start": "node dist/src/index.js",
"dev": "ts-node-dev src/index.ts",
"build": "tsc"
},
"keywords": [],
"author": "mahmoudAlBaghdady",
"license": "ISC",
"devDependencies": {
"#types/cors": "^2.8.12",
"#types/express": "^4.17.13",
"#types/mongoose": "^5.11.97",
"#types/morgan": "^1.9.3",
"#types/node": "^17.0.41",
"ts-node-dev": "^2.0.0",
"typescript": "^4.7.3"
},
"dependencies": {
"#types/axios": "^0.14.0",
"#types/bcryptjs": "^2.4.2",
"#types/body-parser": "^1.19.2",
"#types/express-graphql": "^0.9.0",
"#types/graphql": "^14.5.0",
"#types/jsonwebtoken": "^8.5.8",
"#types/react-calendar": "^3.5.1",
"axios": "^0.27.2",
"bcryptjs": "^2.4.3",
"body-parser": "^1.20.0",
"cloudinary": "^1.30.1",
"cors": "^2.8.5",
"dotenv": "^16.0.1",
"express": "^4.18.1",
"express-async-handler": "^1.2.0",
"express-graphql": "^0.12.0",
"graphql": "^15.8.0",
"jsonwebtoken": "^8.5.1",
"morgan": "^1.10.0",
"react-calendar": "^3.7.0"
}
}
this is my package.json
Procfile
web: npm start
and this is the error I'm getting from heroku
2022-08-25T05:20:04.090743+00:00 heroku[web.1]: State changed from crashed to starting
2022-08-25T05:20:06.797284+00:00 heroku[web.1]: Starting process with command npm start
2022-08-25T05:20:09.300554+00:00 heroku[web.1]: Process exited with status 1
2022-08-25T05:20:09.452051+00:00 heroku[web.1]: State changed from starting to crashed
2022-08-25T05:20:09.075632+00:00 app[web.1]:
2022-08-25T05:20:09.075643+00:00 app[web.1]: > bookingevents#1.0.0 start
2022-08-25T05:20:09.075643+00:00 app[web.1]: > node dist/src/index.js
2022-08-25T05:20:09.075643+00:00 app[web.1]:
2022-08-25T05:20:09.136536+00:00 app[web.1]: node:internal/modules/cjs/loader:959
2022-08-25T05:20:09.136538+00:00 app[web.1]: throw err;
2022-08-25T05:20:09.136538+00:00 app[web.1]: ^
2022-08-25T05:20:09.136539+00:00 app[web.1]:
2022-08-25T05:20:09.136539+00:00 app[web.1]: Error: Cannot find module '/app/dist/src/index.js'
2022-08-25T05:20:09.136540+00:00 app[web.1]: at Function.Module._resolveFilename (node:internal/modules/cjs/loader:956:15)
2022-08-25T05:20:09.136540+00:00 app[web.1]: at Function.Module._load (node:internal/modules/cjs/loader:804:27)
2022-08-25T05:20:09.136541+00:00 app[web.1]: at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
2022-08-25T05:20:09.136541+00:00 app[web.1]: at node:internal/main/run_main_module:17:47 {
2022-08-25T05:20:09.136541+00:00 app[web.1]: code: 'MODULE_NOT_FOUND',
2022-08-25T05:20:09.136542+00:00 app[web.1]: requireStack: []
2022-08-25T05:20:09.136542+00:00 app[web.1]: }
it isn't working in any way I've been trying for hours
and if someone solved it can you please explain it to me thanks alot
I'm trying to deploy my app on Heroku, having 2 package.json files.
First is for the frontend:
{
"name": "quiz",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "npm start --prefix server",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test",
"heroku-postbuild": "npm run build --prefix server && ng build --prod"
},
"private": true,
"dependencies": {
"#angular/animations": "~12.0.2",
"#angular/common": "~12.0.2",
"#angular/compiler": "~12.0.2",
"#angular/core": "~12.0.2",
"#angular/forms": "~12.0.2",
"#angular/platform-browser": "~12.0.2",
"#angular/platform-browser-dynamic": "~12.0.2",
"#angular/router": "~12.0.2",
"rxjs": "~6.6.0",
"tslib": "^2.1.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#types/express": "^4.17.13",
"#angular-devkit/build-angular": "~12.0.2",
"#angular/cli": "~12.0.2",
"#angular/compiler-cli": "~12.0.2",
"#types/jasmine": "~3.6.0",
"#types/node": "^12.11.1",
"jasmine-core": "~3.8.0",
"karma": "~6.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.7.0",
"typescript": "~4.2.3"
},
"engines": {
"node": "16.x",
"npm": "7.x"
}
}
Second is for the backend:
{
"name": "server",
"version": "1.0.0",
"description": "",
"main": "dist/index",
"scripts": {
"start": "node ./dist/server/index.js",
"dev": "nodemon index.ts",
"build": "tsc -p ."
},
"author": "",
"license": "ISC",
"devDependencies": {
"#types/express": "^4.17.13",
"#types/node": "^16.6.1",
"nodemon": "^2.0.12",
"ts-node": "^10.2.1",
"typescript": "^4.3.5"
},
"dependencies": {
"express": "^4.17.1",
"zone.js": "^0.11.4"
},
"engines": {
"node": "16.x",
"npm": "7.x"
}
}
As my package.json starts first and triggers /server/package.json - first I try to build backend, using "heroku-postbuild" command in main package.json file and after that this command builds Angular app.
But after Heroku runs "start" command it shows such mistake:
Error: Cannot find module 'express'
2021-09-18T17:16:28.140193+00:00 app[web.1]: Require stack:
2021-09-18T17:16:28.140194+00:00 app[web.1]: - /app/server/dist/server/config/express.js
2021-09-18T17:16:28.140194+00:00 app[web.1]: - /app/server/dist/server/index.js
2021-09-18T17:16:28.140199+00:00 app[web.1]: at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
2021-09-18T17:16:28.140200+00:00 app[web.1]: at Function.Module._load (node:internal/modules/cjs/loader:778:27)
2021-09-18T17:16:28.140200+00:00 app[web.1]: at Module.require (node:internal/modules/cjs/loader:1005:19)
2021-09-18T17:16:28.140200+00:00 app[web.1]: at require (node:internal/modules/cjs/helpers:94:18)
2021-09-18T17:16:28.140201+00:00 app[web.1]: at Object.<anonymous> (/app/server/dist/server/config/express.js:6:33)
2021-09-18T17:16:28.140201+00:00 app[web.1]: at Module._compile (node:internal/modules/cjs/loader:1101:14)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Module.load (node:internal/modules/cjs/loader:981:32)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Function.Module._load (node:internal/modules/cjs/loader:822:12)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Module.require (node:internal/modules/cjs/loader:1005:19) {
2021-09-18T17:16:28.140203+00:00 app[web.1]: code: 'MODULE_NOT_FOUND',
2021-09-18T17:16:28.140204+00:00 app[web.1]: requireStack: [
2021-09-18T17:16:28.140204+00:00 app[web.1]: '/app/server/dist/server/config/express.js',
2021-09-18T17:16:28.140204+00:00 app[web.1]: '/app/server/dist/server/index.js'
2021-09-18T17:16:28.140205+00:00 app[web.1]: ]
2021-09-18T17:16:28.140205+00:00 app[web.1]: }
When I run all those commands locally - it works.
I solved that problem by moving "express" into my main package.json file, but that's not what I'm trying to achieve. I want to have 2 separate json files so I can handle my installed modules for each backend and frontend easily.
What am I doing wrong?
So the problem was actually that I needed to do npm install both in server and frontend folders.
Heroku has a special command 'heroku-prebuild' which helps to prepare every folder to be built.
I created such commands:
"heroku-prebuild": "npm install --prefix server && npm install",
"heroku-postbuild": "npm run build --prefix server && ng build --prod"
Firstly, Heroku runs "heroku-prebuild", which installs all npm modules for both frontend and backend and, after that, it runs "heroku-postbuild", which builds frontend and backend dist folders.
After that it runs "start": "npm start --prefix server" and everything works.
Hi while uploading my app on Heroku I am getting the following error - "throw new Error('Cannot create a client without an access token');"
const mbxGeocoding = require('#mapbox/mapbox-sdk/services/geocoding');
const geocodingClient = mbxGeocoding({ accessToken: process.env.MAPBOX_TOKEN });
This is how I am using Mapbox token through process.env.MAPBOX_TOKEN
My log file
2019-12-31T13:18:05.574782+00:00 heroku[web.1]: Starting process with command `npm start`
2019-12-31T13:18:08.114540+00:00 app[web.1]:
2019-12-31T13:18:08.114592+00:00 app[web.1]: > mnb#0.0.0 start /app
2019-12-31T13:18:08.114594+00:00 app[web.1]: > node ./bin/www
2019-12-31T13:18:08.114597+00:00 app[web.1]:
2019-12-31T13:18:09.265365+00:00 app[web.1]: /app/node_modules/#mapbox/mapbox-sdk/lib/classes/mapi-client.js:25
2019-12-31T13:18:09.265398+00:00 app[web.1]: throw new Error('Cannot create a client without an access token');
2019-12-31T13:18:09.265400+00:00 app[web.1]: ^
2019-12-31T13:18:09.265403+00:00 app[web.1]:
2019-12-31T13:18:09.265405+00:00 app[web.1]: Error: Cannot create a client without an access token
2019-12-31T13:18:09.265408+00:00 app[web.1]: at NodeClient.MapiClient (/app/node_modules/#mapbox/mapbox-sdk/lib/classes/mapi-client.js:25:11)
2019-12-31T13:18:09.265410+00:00 app[web.1]: at new NodeClient (/app/node_modules/#mapbox/mapbox-sdk/lib/node/node-client.js:7:14)
2019-12-31T13:18:09.265412+00:00 app[web.1]: at createNodeClient (/app/node_modules/#mapbox/mapbox-sdk/lib/node/node-client.js:24:10)
2019-12-31T13:18:09.265414+00:00 app[web.1]: at /app/node_modules/#mapbox/mapbox-sdk/services/service-helpers/create-service-factory.js:13:16
2019-12-31T13:18:09.265416+00:00 app[web.1]: at Object.<anonymous> (/app/middleware/index.js:7:25)
2019-12-31T13:18:09.265418+00:00 app[web.1]: at Module._compile (internal/modules/cjs/loader.js:959:30)
2019-12-31T13:18:09.265423+00:00 app[web.1]: at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10)
2019-12-31T13:18:09.265425+00:00 app[web.1]: at Module.load (internal/modules/cjs/loader.js:815:32)
2019-12-31T13:18:09.265427+00:00 app[web.1]: at Function.Module._load (internal/modules/cjs/loader.js:727:14)
2019-12-31T13:18:09.265429+00:00 app[web.1]: at Module.require (internal/modules/cjs/loader.js:852:19)
2019-12-31T13:18:09.265431+00:00 app[web.1]: at require (internal/modules/cjs/helpers.js:74:18)
2019-12-31T13:18:09.265433+00:00 app[web.1]: at Object.<anonymous> (/app/controllers/index.js:7:32)
Package.json
{
"name": "mnb",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"#mapbox/mapbox-sdk": "^0.5.0",
"#sendgrid/mail": "^6.3.1",
"body-parser": "^1.18.3",
"cloudinary": "^1.13.2",
"cookie-parser": "~1.4.3",
"debug": "~4.1.1",
"dotenv": "^8.2.0",
"ejs": "~2.6.1",
"ejs-mate": "^3.0.0",
"express": "^4.16.4",
"express-session": "^1.15.6",
"faker": "^4.1.0",
"method-override": "^3.0.0",
"mongoose": "^5.8.3",
"mongoose-paginate": "^5.0.3",
"morgan": "^1.9.1",
"multer": "^1.4.1",
"multer-storage-cloudinary": "^2.2.1",
"passport": "^0.4.0",
"passport-local": "^1.0.0",
"passport-local-mongoose": "^5.0.1",
"serve-favicon": "~2.5.0"
},
"devDependencies": {
"nodemon": "^2.0.2"
}
}
Thanks for helping!
Make sure there are no spaces when you declare your mapbox token in your .env file
Wrong:
MAPBOX_TOKEN = ckzsjnzvkqsd,mvlqdf,;ev^q;v
Correct:
MAPBOX_TOKEN=ckzsjnzvkqsd,mvlqdf,;ev^q;v
I am trying to deploy a Foundation web app based on Yarn, Gulp and Node.js on Heroku. It works with heroku local web but crashes on the Heroku server.
I have set the port correctly. I am trying to remove Browsersync and use gulp-connect instead. In my gulpfile.js I have set the connectHeroku task which is run after build. I have set the yarn start command in the environment for Heroku.
Here is my gulp.babel.js:
'use strict';
import plugins from 'gulp-load-plugins';
import yargs from 'yargs';
import browser from 'browser-sync';
import gulp from 'gulp';
import panini from 'panini';
import rimraf from 'rimraf';
import sherpa from 'style-sherpa';
import yaml from 'js-yaml';
import fs from 'fs';
import webpackStream from 'webpack-stream';
import webpack2 from 'webpack';
import named from 'vinyl-named';
import uncss from 'uncss';
import autoprefixer from 'autoprefixer';
import gulpConnect from 'gulp-connect';
// Load all Gulp plugins into one variable
const $ = plugins();
// Check for --production flag
const PRODUCTION = !!(yargs.argv.production);
// Load settings from config.yml
const { COMPATIBILITY, PORT, UNCSS_OPTIONS, PATHS } = loadConfig();
function loadConfig() {
let ymlFile = fs.readFileSync('config.yml', 'utf8');
return yaml.load(ymlFile);
}
// Build the "dist" folder by running all of the below tasks
// Sass must be run later so UnCSS can search for used classes in the others assets.
gulp.task('build',
gulp.series(clean, gulp.parallel(pages, javascript, images, copy), sass, styleGuide));
gulp.task('connectHeroku', function () {
gulpConnect.server({
root: PATHS.dist,
port: process.env.PORT || PORT
});
});
// Build the site, run the server, and watch for file changes
gulp.task('default',gulp.series('build','connectHeroku'));
// gulp.task('default',gulp.series('build','connectHeroku'));
// gulp.task('default',
// gulp.series('build','connectHeroku'));
// gulp.task('start','node app.js');
// gulp.task('default',
// gulp.series('build', server, watch));
// Delete the "dist" folder
// This happens every time a build starts
function clean(done) {
rimraf(PATHS.dist, done);
}
// Copy files out of the assets folder
// This task skips over the "img", "js", and "scss" folders, which are parsed separately
function copy() {
return gulp.src(PATHS.assets)
.pipe(gulp.dest(PATHS.dist + '/assets'));
}
// Copy page templates into finished HTML files
function pages() {
return gulp.src('src/pages/**/*.{html,hbs,handlebars}')
.pipe(panini({
root: 'src/pages/',
layouts: 'src/layouts/',
partials: 'src/partials/',
data: 'src/data/',
helpers: 'src/helpers/'
}))
.pipe(gulp.dest(PATHS.dist));
}
// Load updated HTML templates and partials into Panini
function resetPages(done) {
panini.refresh();
done();
}
// Generate a style guide from the Markdown content and HTML template in styleguide/
function styleGuide(done) {
sherpa('src/styleguide/index.md', {
output: PATHS.dist + '/styleguide.html',
template: 'src/styleguide/template.html'
}, done);
}
// Compile Sass into CSS
// In production, the CSS is compressed
function sass() {
const postCssPlugins = [
// Autoprefixer
autoprefixer({ browsers: COMPATIBILITY }),
// UnCSS - Uncomment to remove unused styles in production
// PRODUCTION && uncss.postcssPlugin(UNCSS_OPTIONS),
].filter(Boolean);
return gulp.src('src/assets/scss/app.scss')
.pipe($.sourcemaps.init())
.pipe($.sass({
includePaths: PATHS.sass
})
.on('error', $.sass.logError))
.pipe($.postcss(postCssPlugins))
.pipe($.if(PRODUCTION, $.cleanCss({ compatibility: 'ie9' })))
.pipe($.if(!PRODUCTION, $.sourcemaps.write()))
.pipe(gulp.dest(PATHS.dist + '/assets/css'))
.pipe(browser.reload({ stream: true }));
}
let webpackConfig = {
mode: (PRODUCTION ? 'production' : 'development'),
module: {
rules: [
{
test: /\.js$/,
use: {
loader: 'babel-loader',
options: {
presets: [ "#babel/preset-env" ],
compact: false
}
}
}
]
},
devtool: !PRODUCTION && 'source-map'
}
// Combine JavaScript into one file
// In production, the file is minified
function javascript() {
return gulp.src(PATHS.entries)
.pipe(named())
.pipe($.sourcemaps.init())
.pipe(webpackStream(webpackConfig, webpack2))
.pipe($.if(PRODUCTION, $.uglify()
.on('error', e => { console.log(e); })
))
.pipe($.if(!PRODUCTION, $.sourcemaps.write()))
.pipe(gulp.dest(PATHS.dist + '/assets/js'));
}
// Copy images to the "dist" folder
// In production, the images are compressed
function images() {
return gulp.src('src/assets/img/**/*')
.pipe($.if(PRODUCTION, $.imagemin([
$.imagemin.jpegtran({ progressive: true }),
])))
.pipe(gulp.dest(PATHS.dist + '/assets/img'));
}
// Start a server with BrowserSync to preview the site in
function server(done) {
browser.init({
server: PATHS.dist, port: process.env.PORT || PORT, open: false
}, done);
}
// Reload the browser with BrowserSync
function reload(done) {
browser.reload();
done();
}
// Watch for changes to static assets, pages, Sass, and JavaScript
function watch() {
gulp.watch(PATHS.assets, copy);
gulp.watch('src/pages/**/*.html').on('all', gulp.series(pages, browser.reload));
gulp.watch('src/{layouts,partials}/**/*.html').on('all', gulp.series(resetPages, pages, browser.reload));
gulp.watch('src/data/**/*.{js,json,yml}').on('all', gulp.series(resetPages, pages, browser.reload));
gulp.watch('src/helpers/**/*.js').on('all', gulp.series(resetPages, pages, browser.reload));
gulp.watch('src/assets/scss/**/*.scss').on('all', sass);
gulp.watch('src/assets/js/**/*.js').on('all', gulp.series(javascript, browser.reload));
gulp.watch('src/assets/img/**/*').on('all', gulp.series(images, browser.reload));
gulp.watch('src/styleguide/**').on('all', gulp.series(styleGuide, browser.reload));
}
My package.json:
{
"name": "Imaginary-Symposium",
"version": "1.0.0",
"description": "Imaginary Symposium",
"main": "gulpfile.babel.js",
"scripts": {
"start": "gulp",
"build": "gulp build --production"
},
"author": "ZURB <foundation#zurb.com>",
"license": "MIT",
"dependencies": {
"foundation-sites": "^6.5.3",
"jquery": "^3.2.1",
"motion-ui": "^2.0.3",
"what-input": "^5.1.2",
"#babel/core": "^7.1.2",
"#babel/preset-env": "^7.1.0",
"#babel/register": "^7.0.0",
"autoprefixer": "^9.1.5",
"babel-loader": "^8.0.4",
"browser-sync": "^2.10.0",
"gulp": "^4.0.0",
"gulp-babel": "^8.0.0",
"gulp-clean-css": "^3.3.1",
"gulp-cli": "^2.0.1",
"gulp-concat": "^2.5.2",
"gulp-connect": "^5.7.0",
"gulp-extname": "^0.2.0",
"gulp-if": "^2.0.0",
"gulp-imagemin": "^4.1.0",
"gulp-load-plugins": "^1.1.0",
"gulp-postcss": "^8.0.0",
"gulp-sass": "^4.0.1",
"gulp-sourcemaps": "^2.6.4",
"gulp-uglify": "^3.0.1",
"gulp-stylus": "^2.7.0",
"js-yaml": "^3.4.6",
"panini": "^1.3.0",
"rimraf": "^2.4.3",
"style-sherpa": "^1.0.0",
"uncss": "^0.16.2",
"vinyl-named": "^1.1.0",
"webpack": "^4.20.2",
"webpack-stream": "^5.1.1",
"yargs": "^12.0.2"
},
"devDependencies": {
"#babel/core": "^7.1.2",
"#babel/preset-env": "^7.1.0",
"#babel/register": "^7.0.0",
"autoprefixer": "^9.1.5",
"babel-loader": "^8.0.4",
"browser-sync": "^2.10.0",
"gulp": "^4.0.0",
"gulp-babel": "^8.0.0",
"gulp-clean-css": "^3.3.1",
"gulp-cli": "^2.0.1",
"gulp-concat": "^2.5.2",
"gulp-connect": "^5.7.0",
"gulp-extname": "^0.2.0",
"gulp-if": "^2.0.0",
"gulp-imagemin": "^4.1.0",
"gulp-load-plugins": "^1.1.0",
"gulp-postcss": "^8.0.0",
"gulp-sass": "^4.0.1",
"gulp-sourcemaps": "^2.6.4",
"gulp-uglify": "^3.0.1",
"gulp-stylus": "^2.7.0",
"js-yaml": "^3.4.6",
"panini": "^1.3.0",
"rimraf": "^2.4.3",
"style-sherpa": "^1.0.0",
"uncss": "^0.16.2",
"vinyl-named": "^1.1.0",
"webpack": "^4.20.2",
"webpack-stream": "^5.1.1",
"yargs": "^12.0.2"
},
"repository": {
"type": "git",
"url": "https://github.com/zurb/foundation-zurb-template.git"
},
"bugs": {
"url": "https://github.com/zurb/foundation-sites/issues",
"email": "foundation#zurb.com"
},
"engines": {
"node": "10.x",
"yarn": "1.16.x"
},
"private": true
}
I would like to have the application deployed on Heroku.
Instead I get this:
2019-07-07T12:35:03.000000+00:00 app[api]: Build started by user
2019-07-07T12:36:25.772475+00:00 app[api]: Deploy c66e2cec by user
2019-07-07T12:36:25.772475+00:00 app[api]: Release v32 created by user
2019-07-07T12:36:27.030070+00:00 heroku[web.1]: State changed from crashed to starting
2019-07-07T12:36:33.644558+00:00 heroku[web.1]: Starting process with command `yarn start`
2019-07-07T12:36:34.000000+00:00 app[api]: Build succeeded
2019-07-07T12:36:35.716329+00:00 app[web.1]: yarn run v1.16.0
2019-07-07T12:36:35.799780+00:00 app[web.1]: $ gulp
2019-07-07T12:36:36.286970+00:00 app[web.1]: [12:36:36] Requiring external module #babel/register
2019-07-07T12:36:36.708934+00:00 app[web.1]: Browserslist: caniuse-lite is outdated. Please run next command `yarn upgrade caniuse-lite browserslist`
2019-07-07T12:36:39.150637+00:00 app[web.1]: [12:36:39] Using gulpfile ~/gulpfile.babel.js
2019-07-07T12:36:39.151579+00:00 app[web.1]: [12:36:39] Starting 'default'...
2019-07-07T12:36:39.153676+00:00 app[web.1]: [12:36:39] Starting 'build'...
2019-07-07T12:36:39.154337+00:00 app[web.1]: [12:36:39] Starting 'clean'...
2019-07-07T12:36:39.163199+00:00 app[web.1]: [12:36:39] Finished 'clean' after 8.42 ms
2019-07-07T12:36:39.163542+00:00 app[web.1]: [12:36:39] Starting 'pages'...
2019-07-07T12:36:39.163731+00:00 app[web.1]: [12:36:39] Starting 'javascript'...
2019-07-07T12:36:39.163915+00:00 app[web.1]: [12:36:39] Starting 'images'...
2019-07-07T12:36:39.164097+00:00 app[web.1]: [12:36:39] Starting 'copy'...
2019-07-07T12:36:39.378140+00:00 app[web.1]: [12:36:39] Finished 'images' after 214 ms
2019-07-07T12:36:39.630308+00:00 app[web.1]: [12:36:39] Finished 'pages' after 467 ms
2019-07-07T12:36:39.664236+00:00 app[web.1]: [12:36:39] Finished 'copy' after 500 ms
2019-07-07T12:36:45.584344+00:00 app[web.1]: [12:36:45] Version: webpack 4.25.1
2019-07-07T12:36:45.584359+00:00 app[web.1]: Built at: 07/07/2019 12:36:45 PM
2019-07-07T12:36:45.584362+00:00 app[web.1]: Asset Size Chunks Chunk Names
2019-07-07T12:36:45.584364+00:00 app[web.1]: app.js 677 KiB app [emitted] app
2019-07-07T12:36:45.584365+00:00 app[web.1]: app.js.map 1.05 MiB app [emitted] app
2019-07-07T12:36:45.584366+00:00 app[web.1]: Entrypoint app = app.js app.js.map
2019-07-07T12:36:45.588167+00:00 app[web.1]: [12:36:45] Finished 'javascript' after 6.42 s
2019-07-07T12:36:45.588354+00:00 app[web.1]: [12:36:45] Starting 'sass'...
2019-07-07T12:36:47.313608+00:00 app[web.1]: [12:36:47] Finished 'sass' after 1.73 s
2019-07-07T12:36:47.313741+00:00 app[web.1]: [12:36:47] Starting 'styleGuide'...
2019-07-07T12:36:47.344145+00:00 app[web.1]: [12:36:47] Finished 'styleGuide' after 30 ms
2019-07-07T12:36:47.344291+00:00 app[web.1]: [12:36:47] Finished 'build' after 8.19 s
2019-07-07T12:36:47.344423+00:00 app[web.1]: [12:36:47] Starting 'connectHeroku'...
2019-07-07T12:36:47.345546+00:00 app[web.1]: [12:36:47] Starting server...
2019-07-07T12:36:47.353434+00:00 app[web.1]: [12:36:47] Server started http://localhost:6186
2019-07-07T12:36:47.353712+00:00 app[web.1]: [12:36:47] Running server
2019-07-07T12:37:34.179753+00:00 heroku[web.1]: State changed from starting to crashed
2019-07-07T12:37:34.252667+00:00 heroku[web.1]: State changed from crashed to starting
2019-07-07T12:37:34.069250+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2019-07-07T12:37:34.069434+00:00 heroku[web.1]: Stopping process with SIGKILL
2019-07-07T12:37:34.164632+00:00 heroku[web.1]: Process exited with status 137
2019-07-07T12:37:39.890453+00:00 heroku[web.1]: Starting process with command `yarn start`
2019-07-07T12:37:42.525193+00:00 app[web.1]: yarn run v1.16.0
2019-07-07T12:37:42.605985+00:00 app[web.1]: $ gulp
2019-07-07T12:37:43.171985+00:00 app[web.1]: [12:37:43] Requiring external module #babel/register
2019-07-07T12:37:43.571081+00:00 app[web.1]: Browserslist: caniuse-lite is outdated. Please run next command `yarn upgrade caniuse-lite browserslist`
2019-07-07T12:37:45.999600+00:00 app[web.1]: [12:37:45] Using gulpfile ~/gulpfile.babel.js
2019-07-07T12:37:46.000576+00:00 app[web.1]: [12:37:46] Starting 'default'...
2019-07-07T12:37:46.002883+00:00 app[web.1]: [12:37:46] Starting 'build'...
2019-07-07T12:37:46.003508+00:00 app[web.1]: [12:37:46] Starting 'clean'...
2019-07-07T12:37:46.011249+00:00 app[web.1]: [12:37:46] Finished 'clean' after 7.45 ms
2019-07-07T12:37:46.011592+00:00 app[web.1]: [12:37:46] Starting 'pages'...
2019-07-07T12:37:46.011777+00:00 app[web.1]: [12:37:46] Starting 'javascript'...
2019-07-07T12:37:46.011956+00:00 app[web.1]: [12:37:46] Starting 'images'...
2019-07-07T12:37:46.012134+00:00 app[web.1]: [12:37:46] Starting 'copy'...
2019-07-07T12:37:46.222874+00:00 app[web.1]: [12:37:46] Finished 'images' after 211 ms
2019-07-07T12:37:46.502195+00:00 app[web.1]: [12:37:46] Finished 'pages' after 490 ms
2019-07-07T12:37:46.514761+00:00 app[web.1]: [12:37:46] Finished 'copy' after 503 ms
2019-07-07T12:37:53.917049+00:00 app[web.1]: [12:37:53] Version: webpack 4.25.1
2019-07-07T12:37:53.917059+00:00 app[web.1]: Built at: 07/07/2019 12:37:53 PM
2019-07-07T12:37:53.917062+00:00 app[web.1]: Asset Size Chunks Chunk Names
2019-07-07T12:37:53.917064+00:00 app[web.1]: app.js 677 KiB app [emitted] app
2019-07-07T12:37:53.917065+00:00 app[web.1]: app.js.map 1.05 MiB app [emitted] app
2019-07-07T12:37:53.917066+00:00 app[web.1]: Entrypoint app = app.js app.js.map
2019-07-07T12:37:53.923691+00:00 app[web.1]: [12:37:53] Finished 'javascript' after 7.91 s
2019-07-07T12:37:53.923957+00:00 app[web.1]: [12:37:53] Starting 'sass'...
2019-07-07T12:37:55.730383+00:00 app[web.1]: [12:37:55] Finished 'sass' after 1.81 s
2019-07-07T12:37:55.730560+00:00 app[web.1]: [12:37:55] Starting 'styleGuide'...
2019-07-07T12:37:55.764813+00:00 app[web.1]: [12:37:55] Finished 'styleGuide' after 34 ms
2019-07-07T12:37:55.764969+00:00 app[web.1]: [12:37:55] Finished 'build' after 9.76 s
2019-07-07T12:37:55.765114+00:00 app[web.1]: [12:37:55] Starting 'connectHeroku'...
2019-07-07T12:37:55.766393+00:00 app[web.1]: [12:37:55] Starting server...
2019-07-07T12:37:55.777651+00:00 app[web.1]: [12:37:55] Server started http://localhost:10590
2019-07-07T12:37:55.778034+00:00 app[web.1]: [12:37:55] Running server
2019-07-07T12:38:39.995481+00:00 heroku[web.1]: State changed from starting to crashed
2019-07-07T12:38:39.903593+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2019-07-07T12:38:39.903593+00:00 heroku[web.1]: Stopping process with SIGKILL
2019-07-07T12:38:39.980831+00:00 heroku[web.1]: Process exited with status 137
OK so here is what I've managed to do and it worked (pls note that I am very new to this):
Stack: Zurb Foundation template (zurb foundation) which uses yarn and gulp for packet management and build. Outputs to a folder called dist (changeable in the config.yml); Expressjs; NodeJS.
Code follows after the steps.
Used #Chris comment above on using Expressjs (expressjs.com) Many thanks #Chris!
created a file server.js in my root folder;
added the following code (see below the listing of server.js) (after reading the documentation and following these two links: HelloDimitri on Heroku stack; Zurb Foundation deployment on Heroku;
had to reconfigure my server.js because of the paths expressjs needed had to be according to my project;
created a procfile in my root folder for Heroku to use yarn instead of npm(uses npm if no profile is there);
updated my gulpfile.babel.js to simply build the app and not start any server;
updated my package.json and added expressjs in the dependencies;
updated my package.json and added the start script for node to start the server as per server.js;
after all that, I ran yarn start locally and it all went well;
pushed the changes to my GitHub repo and deployed on Heroku.
and that's it.
I hope this helps people with the same issue. Many thanks to #Chris.
cheers.
package.json scripts:
"scripts": {
"start": "gulp && node server.js",
"build": "gulp build --production" }
package.json dependencies (I have the same as devDependencies. still don't know if I need them or not for the build on Heroku. Will update once I find out.):
"dependencies": {
"express": "^4.14.1",
"foundation-sites": "^6.5.3",
"jquery": "^3.2.1",
"motion-ui": "^2.0.3",
"what-input": "^5.1.2",
"#babel/core": "^7.1.2",
"#babel/preset-env": "^7.1.0",
"#babel/register": "^7.0.0",
"autoprefixer": "^9.1.5",
"babel-loader": "^8.0.4",
"browser-sync": "^2.10.0",
"gulp": "^4.0.0",
"gulp-babel": "^8.0.0",
"gulp-clean-css": "^3.3.1",
"gulp-cli": "^2.0.1",
"gulp-concat": "^2.5.2",
"gulp-connect": "^5.7.0",
"gulp-extname": "^0.2.0",
"gulp-if": "^2.0.0",
"gulp-imagemin": "^4.1.0",
"gulp-load-plugins": "^1.1.0",
"gulp-postcss": "^8.0.0",
"gulp-sass": "^4.0.1",
"gulp-sourcemaps": "^2.6.4",
"gulp-uglify": "^3.0.1",
"gulp-stylus": "^2.7.0",
"js-yaml": "^3.4.6",
"panini": "^1.3.0",
"rimraf": "^2.4.3",
"style-sherpa": "^1.0.0",
"uncss": "^0.16.2",
"vinyl-named": "^1.1.0",
"webpack": "^4.20.2",
"webpack-stream": "^5.1.1",
"yargs": "^12.0.2"
}
gulpfile.babel.js
gulp.task('default',gulp.series('build'));
Profile
web: yarn start
server.js code:
// server.js
var express = require('express')
var app = express()
app.set('port', (process.env.PORT || 5000))
app.use(express.static('dist',{
index: false,
immutable: true,
cacheControl: true,
maxAge: "30d"
}));
// app.use('/bower_components', express.static(__dirname + '/bower_components'))
console.log("dirname "+__dirname)
app.get('/', function(request, response) {
console.log('request: '+request)
response.sendFile(__dirname+'/dist/index.html')
})
app.listen(app.get('port'), function() {
console.log("Node app is running at localhost:" + app.get('port'))
})
I know this is the same question that this guy had here but I cannot comment yet as I don't have 50 reputation.
I tried following the answers that question provided but it is still having the same error with Heroku not being able to find 'express'. However, express is showing up in my dependencies in the packages.json and is all running correctly locally. I also "npm install express --save" as well as trying it with a -g flag. What else can I do so that Heroku can find 'express'?
My package.json contains:
{
"name": "spark",
"version": "1.0.0",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "MAXXtreme",
"license": "MIT",
"dependencies": {
"ejs": "^2.5.7",
"engines": {
"node": "6.11.2",
"npm": "5.5.1"
},
"express": "^4.16.2",
"express-fileupload": "^0.3.0",
"express-messages": "^1.0.1",
"express-session": "^1.15.6",
"express-validator": "^4.3.0",
"mongoose": "^4.12.4"
},
"devDependencies": {},
"description": ""
}
My app.js contains:
var express = require('express');
var mongoose = require('mongoose');
var config = require('./config/database');
// Connect to db
mongoose.connect(config.database);
var db = mongoose.connection;
db.on('error', console.error.bind(console, 'connection error:'));
db.once('open', function () {
console.log('Connected to MongoDB');
});
// Init app
var app = express();
// View engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// Set public folder
app.use(express.static(path.join(__dirname, 'public')));
// Start the server
var port = process.env.PORT || 3000;
app.listen(port, function () {
console.log('Server started on port ' + port);
});
Here are the logs from Heroku CLI:
2017-10-30T13:22:23.512366+00:00 app[api]: Initial release by user matt#steeltechmfg.com
2017-10-30T13:22:23.512366+00:00 app[api]: Release v1 created by user matt#steeltechmfg.com
2017-10-30T13:22:23.607220+00:00 app[api]: Release v2 created by user matt#steeltechmfg.com
2017-10-30T13:22:23.607220+00:00 app[api]: Enable Logplex by user matt#steeltechmfg.com
2017-10-30T13:28:32.000000+00:00 app[api]: Build started by user matt#steeltechmfg.com
2017-10-30T13:29:04.387219+00:00 app[api]: Release v3 created by user matt#steeltechmfg.com
2017-10-30T13:28:32.000000+00:00 app[api]: Build succeeded
2017-10-30T13:29:04.401658+00:00 app[api]: Scaled to web#1:Free by user matt#steeltechmfg.com
2017-10-30T13:29:04.387219+00:00 app[api]: Deploy dc2a122a by user matt#steeltechmfg.com
2017-10-30T13:29:06.586186+00:00 heroku[web.1]: Starting process with command `node --debug=5858 app.js`
2017-10-30T13:29:08.458266+00:00 app[web.1]: Debugger listening on [::]:5858
2017-10-30T13:29:08.521127+00:00 app[web.1]: module.js:471
2017-10-30T13:29:08.521129+00:00 app[web.1]: throw err;
2017-10-30T13:29:08.521130+00:00 app[web.1]: ^
2017-10-30T13:29:08.521131+00:00 app[web.1]:
2017-10-30T13:29:08.521131+00:00 app[web.1]: Error: Cannot find module 'express'
2017-10-30T13:29:08.521132+00:00 app[web.1]: at Function.Module._resolveFilename (module.js:469:15)
2017-10-30T13:29:08.521133+00:00 app[web.1]: at Function.Module._load (module.js:417:25)
2017-10-30T13:29:08.521134+00:00 app[web.1]: at Module.require (module.js:497:17)
2017-10-30T13:29:08.521134+00:00 app[web.1]: at require (internal/module.js:20:19)
2017-10-30T13:29:08.521135+00:00 app[web.1]: at Object.<anonymous> (/app/app.js:1:77)
2017-10-30T13:29:08.521135+00:00 app[web.1]: at Module._compile (module.js:570:32)
2017-10-30T13:29:08.521136+00:00 app[web.1]: at Object.Module._extensions..js (module.js:579:10)
2017-10-30T13:29:08.521136+00:00 app[web.1]: at Module.load (module.js:487:32)
2017-10-30T13:29:08.521137+00:00 app[web.1]: at tryModuleLoad (module.js:446:12)
2017-10-30T13:29:08.521138+00:00 app[web.1]: at Function.Module._load (module.js:438:3)
2017-10-30T13:29:08.617580+00:00 heroku[web.1]: State changed from starting to crashed
2017-10-30T13:29:08.620539+00:00 heroku[web.1]: State changed from crashed to starting
2017-10-30T13:29:08.598008+00:00 heroku[web.1]: Process exited with status 1
Try Placing engines outside the dependencies in your package.json
{
"name": "spark",
"version": "1.0.0",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "MAXXtreme",
"license": "MIT",
"engines": {
"node": "6.11.2",
"npm": "5.5.1"
},
"dependencies": {
"ejs": "^2.5.7",
"express": "^4.16.2",
"express-fileupload": "^0.3.0",
"express-messages": "^1.0.1",
"express-session": "^1.15.6",
"express-validator": "^4.3.0",
"mongoose": "^4.12.4"
},
"devDependencies": {},
"description": ""
}