Pueden ayudarme con Gulp...

Pregunta de la clase:
Miguel Angel Espeso Alvarez

Miguel Angel Espeso Alvarez

Pregunta
studenthace 7 años

Perdonen por tanta pregunta, pero estoy bloqueado y no puedo seguir adelante.

No me corre Gulp en platzigram, por lo que todos los cambios echo en server.js no surten efecto, por lo que no puedo seguir adelante. No se porque no funciona ya que ese archivo ne asido modificado.

Muestro el error y los archivos: packagejson, server.js y Gulpfile a ver si ustedes pueden ver lo que yo no veo, espero pueda ayudarme alguien, para poder seguir con el proyecto.

Gracias.

Error de consola:

λ npm run build > michaelgram@0.1.0 build C:\Users\victor\CURSOS\JAVASCRIPT-NODE\PROYECTO MICHAELGRAM\michaelgram > gulp assert.js:42 throw new errors.AssertionError({ ^ AssertionError [ERR_ASSERTION]: Task function must be specified at Gulp.set [as _setTask] (C:\Users\victor\CURSOS\JAVASCRIPT-NODE\PROYECTO MICHAELGRAM\michaelgram\node_modules\undertaker\lib\set-task.js:10:3) at Gulp.task (C:\Users\victor\CURSOS\JAVASCRIPT-NODE\PROYECTO MICHAELGRAM\michaelgram\node_modules\undertaker\lib\task.js:13:8) at Object.<anonymous> (C:\Users\victor\CURSOS\JAVASCRIPT-NODE\PROYECTO MICHAELGRAM\michaelgram\gulpfile.js:125:6) at Module._compile (module.js:652:30) at Object.Module._extensions..js (module.js:663:10) at Module.load (module.js:565:32) at tryModuleLoad (module.js:505:12) at Function.Module._load (module.js:497:3) at Module.require (module.js:596:17) at require (internal/module.js:11:18) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! michaelgram@0.1.0 build: `gulp` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the michaelgram@0.1.0 build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\victor\AppData\Roaming\npm-cache\_logs\2018-05-21T15_51_53_711Z-debug.log

El archivo packagejson:

{ "name": "michaelgram", "version": "0.1.0", "description": "Programa para compartir fotos con tus amigos", "main": "server.js", "keywords": [ "Curso", "definitivo", "de", "javascript", "de", "Platzi" ], "author": "Miguel Espeso <miguelestabaenlaparra@gmail.com> (https://webapplicationdeveloper.es)", "license": "MIT", "dependencies": { "aws-sdk": "^2.239.1", "axios": "^0.18.0", "babel-polyfill": "^6.26.0", "body-parser": "^1.18.3", "cookie-parser": "^1.4.3", "empty-element": "^1.0.0", "express": "^4.16.3", "express-session": "^1.15.6", "file-extension": "^4.0.2", "intl": "^1.2.5", "intl-messageformat": "^2.2.0", "intl-relativeformat": "^2.1.0", "materialize-css": "^0.100.2", "multer": "^1.3.0", "multer-s3": "^2.7.0", "node-pre-gyp": "^0.9.1", "page": "^1.8.6", "passport": "^0.4.0", "passport-facebook": "^2.1.1", "passport-local": "^1.0.0", "michaelgram-client": "file:../michaelgram-client", "pug": "^2.0.3", "readable-stream": "^2.3.6", "superagent": "^3.8.3", "title": "^3.2.0", "vinyl-source-stream": "^2.0.0", "yo-yo": "^1.4.1" }, "devDependencies": { "babel-core": "^6.26.3", "babel-loader": "^7.1.4", "babel-plugin-syntax-async-functions": "^6.13.0", "babel-plugin-transform-regenerator": "^6.26.0", "babel-preset-env": "^1.6.1", "babel-preset-es2015": "^6.24.1", "babelify": "^8.0.0", "browserify": "^16.2.0", "gulp": "^4.0.0", "gulp-rename": "^1.2.2", "gulp-sass": "^4.0.1", "watchify": "^3.11.0", "webpack": "^2.7.0" }, "scripts": { "build": "gulp", "start": "concurrently \"gulp watch\" \"node server.js\"" } }

Archivo Gulpfile.js:

let gulp = require('gulp'); let sass = require('gulp-sass'); let rename = require('gulp-rename'); let babel = require('babelify'); let browserify = require('browserify'); let source = require('vinyl-source-stream'); let watchify = require('watchify'); gulp.task('styles', function () { gulp .src('index.scss') .pipe(sass()) .pipe(rename('app.css')) .pipe(gulp.dest('public')); }) gulp.task('assets', function () { gulp .src('assets/*') .pipe(gulp.dest('public')); }) function compile(watch) { let bundle = browserify('./src/index.js', {debug: true}); if (watch) { bundle = watchify(bundle); bundle.on('update', function () { console.log('--> Bundling...'); rebundle(); }); } function rebundle() { bundle .transform(babel, { presets: [ 'es2015' ], plugins: [ 'syntax-async-functions', 'transform-regenerator' ] }) .bundle() .on('error', function (err) { console.log(err); this.emit('end') }) .pipe(source('index.js')) .pipe(rename('app.js')) .pipe(gulp.dest('public')); } rebundle(); } gulp.task('build', function () { return compile(); }); gulp.task('watch', function () { return compile(true); }); gulp.task('default', ['styles', 'assets', 'build']);

Y el server.js:

let express = require('express'); let aws = require('aws-sdk'); let multer = require('multer'); let multerS3 = require('multer-s3'); let ext = require('file-extension'); let cookieParser = require('cookie-parser'); let bodyParser = require('body-parser'); let expressSession = require('express-session'); let passport = require('passport'); let michaelgram = require('michaelgram-client') let config = require('./config'); let port = process.env.PORT || 3000; let client = michaelgram.createClient(config.client); let s3 = new aws.S3({ accessKeyId: config.aws.accessKey, secretAccessKey: config.aws.secretKey }); let storage = multerS3({ s3: s3, bucket: 'michaelgram', acl: 'public-read', metadata: function (req, file, cb) { cb(null, { fieldName: file.fieldname }) }, key: function (req, file, cb) { cb(null, +Date.now() + '.' + ext(file.originalname)) } }); let upload = multer({ storage: storage }).single('picture'); let app = express(); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); app.use(cookieParser()); app.use(expressSession({ secret: config.secret, resave: false, saveUninitialized: false })) app.use(passport.initialize()) app.use(passport.session()) app.set('view engine', 'pug'); app.use(express.static('public')); app.get('/', function (req, res) { res.render('index', { title: 'Michaelgram' }); }) app.get('/signup', function (req, res) { res.render('index', { title: 'Michaelgram - Signup' }); }) app.post('/signup', function (req, res) { let user = req.body; client.saveUser(user, function (err, usr) { if (err) return res.status(500).send(err.message) res.redirect('/signin'); }); }); app.get('/signin', function (req, res) { res.render('index', { title: 'Michaelgram - Signin' }); }) app.get('/api/pictures', function (req, res, next) { let pictures = [ { user: { username: 'miguelito', avatar: 'https://i1.wp.com/www.sopitas.com/wp-content/uploads/2016/04/escorpiones.jpg?fit=860%2C484' }, url: 'office.jpg', likes: 0, liked: false, createdAt: new Date().getTime() }, { user: { username: 'miguelito', avatar: 'https://i1.wp.com/www.sopitas.com/wp-content/uploads/2016/04/escorpiones.jpg?fit=860%2C484' }, url: 'office.jpg', likes: 1, liked: true, createdAt: new Date().setDate(new Date().getDate() - 10) } ]; setTimeout(function () { res.send(pictures); }, 2000) }); app.post('/api/pictures', function (req, res) { upload(req, res, function (err) { if (err) { return res.send(500, "Error uploading file"); } res.send('File uploaded'); }) }) app.get('/api/user/:username', (req, res) => { const user = { username: 'miguelito', avatar: 'https://i1.wp.com/www.sopitas.com/wp-content/uploads/2016/04/escorpiones.jpg?fit=860%2C484', pictures: [ { id: 1, src: 'https://us.123rf.com/450wm/swisshippo/swisshippo1310/swisshippo131000194/23050498-pueblo-hist%C3%B3rico-en-el-lago-thun-suiza.jpg?ver=6', likes: 3 }, { id: 2, src: 'http://footage.framepool.com/shotimg/qf/300705148-blueemlisalp-lago-de-thun-bandera-suiza-popa.jpg', likes: 1 }, { id: 3, src: 'https://thumbs.dreamstime.com/b/castillo-de-oberhofen-en-el-lago-thun-suiza-16859899.jpg', likes: 10 }, { id: 4, src: 'https://sobresuiza.com/wp-content/uploads/2009/07/thun.jpg', likes: 0 }, { id: 5, src: 'https://i1.wp.com/viajeslostplanet.com/wp-content/uploads/2018/03/20170729_213300.jpg?fit=1200%2C900&ssl=1', likes: 23 }, { id: 6, src: 'https://us.123rf.com/450wm/swisshippo/swisshippo1310/swisshippo131000194/23050498-pueblo-hist%C3%B3rico-en-el-lago-thun-suiza.jpg?ver=6', likes: 11 } ] } res.send(user); }) app.get('/:username', function (req, res) { res.render('index', { title: `Michaelgram - ${req.params.username}` }); }) app.get('/:username/:id', function (req, res) { res.render('index', { title: `Michaelgram - ${req.params.username}` }); }) app.listen(3000, function (err) { if (err) return console.log('Hubo un error'), process.exit(1); console.log('Michaelgram escuchando en el puerto 3000'); })
1 respuestas
para escribir tu comentario
    Miguel Angel Espeso Alvarez

    Miguel Angel Espeso Alvarez

    studenthace 7 años

    Creo que solucione parte del problema. Modifique la última línea del archivo Gulpfile.js de la siguiente manera.

    //CAMBIE: gulp.task('default', ['styles', 'assets', 'build']); // POR: gulp.task('default', gulp.series('styles', 'assets', 'build'));``` Parece que funciona, he instalado gulp de manera global como decían en varios sitios que busque. https://stackoverflow.com/questions/24027551/gulp-command-not-found-error-after-installing-gulp https://github.com/openscope/openscope/blob/develop/tools/README.md Ya funciona el formulario, aunque no lleguen los datos del registro a rethinkdb, eso empezare a luchar con ello mañana, je, je, je
Curso Profesional de Node.js y JavaScript 2016

Curso Profesional de Node.js y JavaScript 2016

Aprende Node.js a fondo, crea una aplicación de Internet de las Cosas (IoT) utilizando protocolos de tiempo real livianos (MQTT) y WebSockets, integra tus aplicaciones con bases de datos relacionales y crea aplicaciones en tiempo real.

Curso Profesional de Node.js y JavaScript 2016
Curso Profesional de Node.js y JavaScript 2016

Curso Profesional de Node.js y JavaScript 2016

Aprende Node.js a fondo, crea una aplicación de Internet de las Cosas (IoT) utilizando protocolos de tiempo real livianos (MQTT) y WebSockets, integra tus aplicaciones con bases de datos relacionales y crea aplicaciones en tiempo real.