How to change base path for assets, images, etc

I need my app to work well on a subfolder of the main domain. Exactly here At first I had a plenty of errors of scripts, css and images not being loaded.

I added the following to next.config.js:

basePath: "/out",

Now scripts and css are working well when exported, they have the /out/ in the path.

However the files do not have yet the /out/ in the path, thus they are giving 404 errors.

I tried to follow this tutorial, but it looks like I am still doing something wrong,

My next.config.js now is:

const path = require("path");

module.exports = {
  trailingSlash: true,
  sassOptions: {
    includePaths: [path.join(__dirname, "styles")],
  },

  basePath: "/out",
  assetPrefix: process.env.BASE_PATH || '',
  publicRuntimeConfig: {
    basePath: process.env.BASE_PATH || '',
  },
};

The relevant piece of the package.json is:

"scripts": { "dev": "node server.js -p $PORT", "build": "next build", "prod": "BASE_PATH=/out next build && next export", "start": "NODE_ENV=production node server.js -p $PORT", "start2": "next start" },

The server.js is:

const express = require('express');
const next = require('next');
const path = require('path');
const bodyParser = require('body-parser');
const keys = require("./server/config/keys");
const stripe = require('stripe')(keys.stripeSecretKey);
const routes = require('./routes');

const dev = process.env.NODE_ENV !== 'production';

const app = next({ dir: '.', dev });
const handle = routes.getRequestHandler(app);

app.prepare().then(() => {
    const server = express();
        // Static files
        // https://github.com/zeit/next.js/tree/4.2.3#user-content-static-file-serving-eg-images
    server.use('/images', express.static(path.join(__dirname, 'images'), {
        maxAge: dev ? '0' : '365d'
    }));

    server.use(bodyParser.json());

    server.get('*', (req, res) => {
        return handle(req, res)
    });

    server.post('/api/stripe/checkout', async (req, res) => {
        await stripe.charges.create({
            amount: req.body.amount,
            currency: 'usd',
            description: 'Mojosa - React Next Landing Page Templates',
            source: req.body.token.id
        });
        res.send({})
    });

    const PORT = process.env.PORT || 3000;

    server.listen(PORT, (err) => {
        if (err) throw err
        console.log(`> Read on http://localhost:${PORT}`)
    });
})

And here is an example of an image in a component:

<div className="col-lg-6 col-md-12">
    <div className="book-image">
    <img src='/images/book-img.png' alt="image" />
</div>

With this configuration:

• EXPORT - next build && next export on the /out/ folder are working well when uploaded to the live website, BUT images are giving 404
• DEV or BUILD they are giving 404 and working much worse than the EXPORT site published on the real domain. If I remove basePath: "/out", the dev mode works excellent

Questions: How can I make the /out/ path be added to all the images/assets? I am ok to re-add basePath: "/out",` when exporting.