After running npm run dev, I get the following errors:
> sistema#1.0.0 dev
> nodemon index.js --exec babel-node
[nodemon] 1.18.9
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `babel-node index.js`
(node:20560) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
C:\Users\elvis\Documents\Proyecto Express\sistema\index.js:1
import express from 'express'; //const express=require('express');
^^^^^^
SyntaxError: Cannot use import statement outside a module
at wrapSafe (internal/modules/cjs/loader.js:984:16)
at Module._compile (internal/modules/cjs/loader.js:1032:27)
at Module._compile (C:\Users\elvis\AppData\Roaming\npm\node_modules\#babel\node\node_modules\pirates\lib\index.js:136:24)
at Module._extensions..js (internal/modules/cjs/loader.js:1097:10)
at Object.newLoader [as .js] (C:\Users\elvis\AppData\Roaming\npm\node_modules\#babel\node\node_modules\pirates\lib\index.js:141:7)
at Module.load (internal/modules/cjs/loader.js:933:32)
at Function.Module._load (internal/modules/cjs/loader.js:774:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
at Object.<anonymous> (C:\Users\elvis\AppData\Roaming\npm\node_modules\#babel\node\lib\_babel-node.js:176:21)
at Module._compile (internal/modules/cjs/loader.js:1068:30)
[nodemon] app crashed - waiting for file changes before starting...
I have tried all the possible solutions:
Adding type module in the package.json file.
Updating babel
Using npx
This is my package.json file:
{
"name": "sistema",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js",
"dev": "nodemon index.js --exec babel-node"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"babel-cli": "^6.26.0",
"babel-preset-env": "^1.7.0",
"babel-preset-stage-3": "^6.24.1",
"bcryptjs": "^2.4.3",
"cors": "^2.8.5",
"express": "^4.16.4",
"express-promise-router": "^3.0.3",
"jsonwebtoken": "^8.5.0",
"mongoose": "^5.4.10",
"morgan": "^1.9.1"
},
"devDependencies": {
"nodemon": "^1.18.9"
}
}
And this is my .babelrc file:
{
"presets": [
//"env" ,
//"stage-3"
]
}
Is someone able to provide me some help or suggestions?
Thank you,
I solved this issue by installing babel with npm install babel-cli babel-core --save-dev
I am trying to deploy my nodejs app on heroku. The build is successful however I am getting these errors:
2020-01-20T23:39:44.000000+00:00 app[api]: Build succeeded
2020-01-20T23:39:46.924595+00:00 heroku[web.1]: Starting process with command `npm install --only=dev && npm run client-install && npm run dev`
2020-01-20T23:39:50.661227+00:00 app[web.1]: npm WARN jackpot#1.0.0 No repository field.
2020-01-20T23:39:50.661677+00:00 app[web.1]:
2020-01-20T23:39:50.704813+00:00 app[web.1]: audited 530 packages in 1.693s
2020-01-20T23:39:50.833913+00:00 app[web.1]:
2020-01-20T23:39:50.833917+00:00 app[web.1]: 4 packages are looking for funding
2020-01-20T23:39:50.833919+00:00 app[web.1]: run `npm fund` for details
2020-01-20T23:39:50.833921+00:00 app[web.1]:
2020-01-20T23:39:50.834704+00:00 app[web.1]: found 0 vulnerabilities
2020-01-20T23:39:50.834706+00:00 app[web.1]:
2020-01-20T23:39:51.165784+00:00 app[web.1]:
2020-01-20T23:39:51.165819+00:00 app[web.1]: > jackpot#1.0.0 client-install /app
2020-01-20T23:39:51.165823+00:00 app[web.1]: > npm install --prefix client
2020-01-20T23:39:51.165825+00:00 app[web.1]:
2020-01-20T23:40:43.615827+00:00 app[web.1]:
2020-01-20T23:40:43.615852+00:00 app[web.1]: > core-js#2.6.11 postinstall /app/client/node_modules/core-js
2020-01-20T23:40:43.615854+00:00 app[web.1]: > node -e "try{require('./postinstall')}catch(e){}"
2020-01-20T23:40:43.615856+00:00 app[web.1]:
2020-01-20T23:40:43.691296+00:00 app[web.1]: Thank you for using core-js ( https://github.com/zloirock/core-js ) for
polyfilling JavaScript standard library!
2020-01-20T23:40:43.691299+00:00 app[web.1]:
2020-01-20T23:40:43.691302+00:00 app[web.1]: The project needs your help! Please consider supporting of core-js on Open Collective or Patreon:
2020-01-20T23:40:43.691305+00:00 app[web.1]: > https://opencollective.com/core-js
2020-01-20T23:40:43.691307+00:00 app[web.1]: > https://www.patreon.com/zloirock
2020-01-20T23:40:43.691309+00:00 app[web.1]:
2020-01-20T23:40:43.691311+00:00 app[web.1]: Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)
2020-01-20T23:40:43.691313+00:00 app[web.1]:
2020-01-20T23:40:43.705353+00:00 app[web.1]:
2020-01-20T23:40:43.705360+00:00 app[web.1]: > core-js-pure#3.6.4 postinstall /app/client/node_modules/core-js-pure
2020-01-20T23:40:43.705365+00:00 app[web.1]: > node -e "try{require('./postinstall')}catch(e){}"
2020-01-20T23:40:43.705368+00:00 app[web.1]:
2020-01-20T23:40:44.193688+00:00 app[web.1]:
2020-01-20T23:40:44.193702+00:00 app[web.1]: > core-js#3.6.4 postinstall /app/client/node_modules/react-app-polyfill/node_modules/core-js
2020-01-20T23:40:44.193707+00:00 app[web.1]: > node -e "try{require('./postinstall')}catch(e){}"
2020-01-20T23:40:44.193709+00:00 app[web.1]:
2020-01-20T23:40:47.195666+00:00 heroku[web.1]: State changed from starting to crashed
2020-01-20T23:40:47.199923+00:00 heroku[web.1]: State changed from crashed to starting
2020-01-20T23:40:47.087841+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2020-01-20T23:40:47.088001+00:00 heroku[web.1]: Stopping process with SIGKILL
2020-01-20T23:40:47.175500+00:00 heroku[web.1]: Process exited with status 137
I did some research online and found that it is related to these lines: server.js:
const PORT = process.env.PORT || 7000;
app.listen(PORT, () => console.log(`Server up and running on port ${PORT} !`));
Only problem is that I have the client code doing API calls to the server, which requires me to a proxy.
server.js:
const express = require("express");
const mongoose = require("mongoose");
const bodyParser = require("body-parser");
const passport = require("passport");
const users = require("./routes/api/users");
const app = express();
// Bodyparser middleware
app.use(
bodyParser.urlencoded({
extended: false
})
);
app.use(bodyParser.json());
// DB Config
const db = require("./config/keys").mongoURI;
// Connect to MongoDB
mongoose
.connect(
db,
{ useNewUrlParser: true,
useUnifiedTopology: true
}
)
.then(() => console.log("MongoDB successfully connected"))
.catch(err => console.log(err));
// Passport middleware
app.use(passport.initialize());
// Passport config
require("./config/passport")(passport);
// Routes
app.use("/api/users", users);
const PORT = process.env.PORT || 5000;
app.listen(PORT, () => console.log(`Server up and running on port ${PORT} !`));
server package.json:
{
"name": "jackpot",
"version": "1.0.0",
"description": "JackPot Application",
"main": "server.js",
"scripts": {
"client-install": "npm install --prefix client",
"start": "node server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"prod": "NODE_ENV=production concurrently \"npm run server\" \"npm run client\""
},
"author": "",
"license": "MIT",
"dependencies": {
"axios": "^0.19.1",
"bcryptjs": "^2.4.3",
"body-parser": "^1.18.3",
"concurrently": "^4.0.1",
"express": "^4.16.4",
"fs": "0.0.1-security",
"is-empty": "^1.2.0",
"jquery": "^3.4.1",
"jsonwebtoken": "^8.3.0",
"mongoose": "^5.3.11",
"nodemailer": "^6.4.2",
"particles-bg": "^2.4.7",
"passport": "^0.4.0",
"passport-jwt": "^4.0.0",
"readline": "^1.3.0",
"sweetalert2": "^9.5.4",
"validator": "^10.9.0",
"ws": "^7.2.1"
}
}
/client/package.json:
{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.19.1",
"classnames": "^2.2.6",
"jquery": "^3.4.1",
"jwt-decode": "^2.2.0",
"particles-bg": "^2.4.7",
"react": "^16.6.3",
"react-chat-window": "^1.2.1",
"react-dom": "^16.6.3",
"react-redux": "^7.1.3",
"react-router-dom": "^5.1.2",
"react-scripts": "3.2.0",
"redux": "^4.0.1",
"redux-thunk": "^2.3.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"proxy": "http://localhost:5000",
"eslintConfig": {
"extends": "react-app"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
I hope one of you guys can help me, I have been scratching my head for hours.
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 am newbie. I am following Tutorial from https://www.sitepoint.com/building-facebook-chat-bot-node-heroku/ to make sample facebook messenger bot.
Just when I deployed it first time in heroku I got error
Here is my package.json
{
"name": "spbot",
"version": "1.0.0",
"description": "Testbot",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app.js"
},
"author": "Munkh",
"license": "ISC",
"dependencies": {
"body-parser": "^1.17.1",
"express": "^4.15.2",
"mongoose": "^4.9.1",
"request": "^2.81.0"
}
}
here is app.js
var express = require("express");
var request = require("request");
var bodyParser = require("body-parser");
var app = express();
app.use(bodyParser.urlencoded({extended: false}));
app.use(bodyParser.json());
app.listen((process.env.PORT || 5000));
// Server index page
app.get("/", function (req, res) {
res.send("Deployed!");
});
// Facebook Webhook
// Used for verification
app.get("/webhook", function (req, res) {
if (req.query["hub.verify_token"] === "this_is_my_token") {
console.log("Verified webhook");
res.status(200).send(req.query["hub.challenge"]);
} else {
console.error("Verification failed. The tokens do not match.");
res.sendStatus(403);
}
});
I got error like this
2017-03-20T02:11:15.997279+00:00 heroku[web.1]: State changed from crashed to starting
2017-03-20T02:11:17.849748+00:00 heroku[web.1]: Starting process with command `npm start`
2017-03-20T02:11:20.455381+00:00 app[web.1]:
2017-03-20T02:11:20.455396+00:00 app[web.1]: > spbot#1.0.0 start /app
2017-03-20T02:11:20.455397+00:00 app[web.1]: > node app.js
2017-03-20T02:11:20.455397+00:00 app[web.1]:
2017-03-20T02:11:20.978077+00:00 heroku[web.1]: Process exited with status 0
2017-03-20T02:11:20.994169+00:00 heroku[web.1]: State changed from starting to crashed
2017-03-20T02:11:20.994986+00:00 heroku[web.1]: State changed from crashed to starting
2017-03-20T02:11:23.337790+00:00 heroku[web.1]: Starting process with command `npm start`
2017-03-20T02:11:27.660508+00:00 app[web.1]:
2017-03-20T02:11:27.660527+00:00 app[web.1]: > node app.js
2017-03-20T02:11:27.660526+00:00 app[web.1]: > spbot#1.0.0 start /app
2017-03-20T02:11:27.660528+00:00 app[web.1]:
2017-03-20T02:11:27.896343+00:00 heroku[web.1]: State changed from starting to crashed
2017-03-20T02:11:27.881546+00:00 heroku[web.1]: Process exited with status 0
Because error doesn't specify what went wrong and just keep crashing, I can't find a solution. My apologies if it is simple question.
You have to specify the node.js and npm version which you are using in package.json, as mentioned below.
Specify the versions which you are using in your development.
{
"name": "spbot",
"version": "1.0.0",
"description": "Testbot",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app.js"
},
"author": "Munkh",
"license": "ISC",
"dependencies": {
"body-parser": "^1.17.1",
"express": "^4.15.2",
"mongoose": "^4.9.1",
"request": "^2.81.0"
},
"engines": {
"node": "7.0.0",
"npm": "3.10.8"
}
}
I have followed the instructions but it stil doesnt work. My repository is this:
https://github.com/diegoarcega/learning_react
Procfile
web: node index.js
index.js
var cool = require('cool-ascii-faces');
var express = require('express');
var path = require('path');
var app = express();
var DIST_DIR = path.resolve(__dirname + '/../dist');
app.set('port', (process.env.PORT || 5000));
app.use('/assets/', express.static(DIST_DIR + '/assets'));
app.get('/', function(req, res) {
res.send('hello');
});
app.get('/cool', function(request, response) {
response.send(cool());
});
app.listen(app.get('port'), function() {
console.log('Listening port ' + app.get('port'))
});
package.json
{
"name": "learning_react",
"version": "0.0.1",
"description": "practising react",
"main": "index.js",
"scripts": {
"kill": "fuser -k 30000/tcp",
"start": "node index.js",
"serve": "node index.js",
"dev": "NODE_ENV=development babel-node server/server.js",
"test": "echo \"Error: no test specified\" && exit 1",
"clean": "rimraf dist/ ",
"copy": "copyfiles -f src/index.html src/favicon.ico dist",
"prod": "npm run clean && webpack --config webpack.config.dist.js -p && npm run copy",
"dist": "NODE_ENV=production babel-node server/server.js ",
"deploy": "surge --project ./dist --domain diegoarcega-react.surge.sh"
},
"repository": {
"type": "git",
"url": "https://github.com/diegoarcega/learning_react"
},
"keywords": [
"REACT"
],
"engines": {
"node": "4.4.5",
"npm": "3.9.6"
},
"author": "Diego Arcega",
"license": "BSD-2-Clause",
"bugs": {
"url": "https://github.com/diegoarcega/learning_react/issues"
},
"dependencies": {
"axios": "^0.12.0",
"babel-polyfill": "^6.9.1",
"cool-ascii-faces": "^1.3.4",
"firebase": "^3.0.5",
"material-ui": "^0.15.1",
"muicss": "^0.6.5",
"q": "^1.4.1",
"react": "~15.1.0",
"react-dom": "~15.1.0",
"react-redux": "~4.4.5",
"react-router": "~2.4.1",
"react-tap-event-plugin": "^1.0.0",
"redux": "~3.5.2",
"redux-thunk": "^2.1.0"
},
"devDependencies": {
"babel-cli": "^6.10.1",
"babel-core": "~6.9.1",
"babel-loader": "~6.2.4",
"babel-plugin-transform-es2015-function-name": "^6.9.0",
"babel-plugin-transform-es2015-literals": "^6.8.0",
"babel-plugin-transform-es2015-template-literals": "^6.8.0",
"babel-plugin-transform-runtime": "^6.9.0",
"babel-preset-es2015": "~6.9.0",
"babel-preset-react": "~6.5.0",
"babel-preset-react-hmre": "^1.1.1",
"babel-preset-react-optimize": "^1.0.1",
"copyfiles": "^1.0.0",
"css-loader": "^0.23.1",
"express": "~4.13.4",
"file-loader": "^0.8.5",
"object-assign": "^4.1.0",
"react-css-modules": "^3.7.6",
"react-tap-event-plugin": "^1.0.0",
"react-thunk": "^1.0.0",
"style-loader": "^0.13.1",
"url-loader": "^0.5.7",
"webpack": "~1.13.1",
"webpack-dev-middleware": "^1.6.1",
"webpack-dev-server": "^1.14.1",
"webpack-hot-middleware": "^2.10.0"
}
}
I am just trying to make it work first. The error log is this:
2016-07-06T17:00:56.197239+00:00 heroku[web.1]: State changed from crashed to starting
2016-07-06T17:01:00.211013+00:00 heroku[web.1]: Starting process with command `node index.js`
2016-07-06T17:01:01.580923+00:00 app[web.1]: module.js:327
2016-07-06T17:00:54.456548+00:00 heroku[api]: Deploy 23f2e63 by diegoarcega#gmail.com
2016-07-06T17:01:01.580940+00:00 app[web.1]: at Object.<anonymous> (/app/index.js:2:15)
2016-07-06T17:01:01.580940+00:00 app[web.1]: at Module._compile (module.js:409:26)
2016-07-06T17:01:02.228107+00:00 heroku[web.1]: State changed from starting to crashed
2016-07-06T17:01:02.212126+00:00 heroku[web.1]: Process exited with status 1
2016-07-06T17:01:01.580941+00:00 app[web.1]: at Function.Module._load (module.js:300:12)
2016-07-06T17:01:01.580942+00:00 app[web.1]: at Function.Module.runMain (module.js:441:10)
2016-07-06T17:01:01.580939+00:00 app[web.1]: at Function.Module._load (module.js:276:25)
2016-07-06T17:01:01.580939+00:00 app[web.1]: at Module.require (module.js:353:17)
2016-07-06T17:01:01.580940+00:00 app[web.1]: at require (internal/module.js:12:17)
2016-07-06T17:01:01.580940+00:00 app[web.1]: at Object.<anonymous> (/app/index.js:2:15)
2016-07-06T17:01:01.580940+00:00 app[web.1]: at Module._compile (module.js:409:26)
2016-07-06T17:01:01.580941+00:00 app[web.1]: at Object.Module._extensions..js (module.js:416:10)
2016-07-06T17:01:02.228107+00:00 heroku[web.1]: State changed from starting to crashed
2016-07-06T17:01:02.212126+00:00 heroku[web.1]: Process exited with status 1
2016-07-06T17:02:12.435185+00:00 heroku[slug-compiler]: Slug compilation started
2016-07-06T17:02:12.435194+00:00 heroku[slug-compiler]: Slug compilation finished
2016-07-06T17:02:12.782559+00:00 heroku[web.1]: State changed from crashed to starting
2016-07-06T17:02:17.345331+00:00 heroku[web.1]: Starting process with command `node index.js`
2016-07-06T17:02:19.470185+00:00 app[web.1]: module.js:327
2016-07-06T17:02:19.470199+00:00 app[web.1]: throw err;
2016-07-06T17:02:19.470211+00:00 app[web.1]: Error: Cannot find module 'express'
2016-07-06T17:02:19.470212+00:00 app[web.1]: at Function.Module._resolveFilename (module.js:325:15)
2016-07-06T17:02:19.470217+00:00 app[web.1]: at Function.Module._load (module.js:300:12)
2016-07-06T17:02:19.470217+00:00 app[web.1]: at Function.Module.runMain (module.js:441:10)
2016-07-06T17:02:20.579075+00:00 heroku[web.1]: Process exited with status 1
2016-07-06T17:02:20.600663+00:00 heroku[web.1]: State changed from starting to crashed
2016-07-06T17:02:12.174712+00:00 heroku[api]: Deploy 23f2e63 by diegoarcega#gmail.com
figured it out, never forget to install express in dependencies instead of devDependencies ;)