Necesito ayuda para que mi cliente exija este trabajo en 3 días y no puedo mostrar la imagen en la plantilla de pug. Básicamente, la imagen se cargó bien como la veo en las cargas, e incluso en img(src"") Puedo verla cuando hago clic con el botón derecho y busco la propiedad, pero la imagen no aparece, es decir, no se muestra desde la caja de bocetos. Intenté reducir el tamaño pero no funcionó. por favor ayuda...
índice.js
var express = require('express'); var app = express() var path = require("path"); //multer object creation var multer = require('multer') var fs = require("fs"); app.use(express.static(__dirname)); var storage = multer.diskStorage({ destination: function (req, file, cb) { fs.mkdir('./uploads/',(err)=>{ cb(null, './uploads/'); }); //cb(null, path.join(__dirname + '../public/uploads')); }, filename: function (req, file, cb) { cb(null, Date.now() + file.originalname); } }) var upload = multer({ storage: storage }) module.exports = function(app){ //GET home page. app.route("/").get(function(req, res, next) { res.render( path.join(__dirname + "/../views/index.pug")); }); app.route("/profile").post(upload.single('avatar'),function(req, res) { var image = req.file; console.log(image); res.render(path.join(__dirname + "/../views/index.pug"), {image: image}) }); }índice.pug
html head title nanas personal portfolio script. document.addEventListener("DOMContentLoaded", funtion(event){ document.querySelector("img") img.style.height = "50px"; img.style.width = "50px"; display = "block" }) meta(name='description', content='Profile') meta(charset='utf-8') meta(http-equiv='X-UA-Compatible', content='IE=edge') meta(name='viewport', content='width=device-width, initial-scale=1') link(rel='stylesheet', href='/public/style.css') header img(src='./uploads/' + image) div.profile-picture label choose/upload profile pic br form(action="/profile", accept="image/x-png,image/gif,image/jpeg,image/jpg", method="post", enctype="multipart/form-data") input(type="file", id="file", name="avatar") br input(type="submit", value="upload") brcargas
uploads/1631587019615nysc.jpg uploads/1631587019615nysc.jpg uploads/1631587019615nysc.jpg uploads/1631587019615nysc.jpgte olvidaste = 😂, el código es img(src='image.png')
No soy desarrollador de .pug, acabo de ver códigos de aquí: https://nodejsera.com/library/pug/pug-images.html
Yo tenía el mismo problema que tú. La única forma en que pude resolverlo es usando el archivo de imagen en la carpeta pública y no en los activos. También depende de cómo tengas configurado el servidor. La forma de escribir es como te dijeron en respuestas anteriores, también te dejo un enlace: https://dev.to/jh3y/pug-in-5-minutes-272k
Espero que te ayude. - Gerva
app.use(express.static(path.join(__dirname, 'public'))); app.set('views', './src/public');