CSS Source Maps are empty after grunt refresh

Question

On Magento 2.4.1, Developer Mode and SSR after running

grunt clean
grunt exec
grunt less

# OR

grunt refresh

Generated Source Maps looks like this

{"version":3,"sources":[],"names":[],"mappings":""}

grunt watch is working properly and looks for changes I made, but in the browser, I see styles-m.css as a source

Here is less.js file with lessOptions (no differences with original)

var lessOptions = {
    options: {
        sourceMap: true,
        strictImports: false,
        sourceMapRootpath: '/',
        dumpLineNumbers: false, // use 'comments' instead false to output line comments for source
        ieCompat: false
    },
    setup: {
        files: {
            '<%= path.css.setup %>/setup.css': '<%= path.less.setup %>/_setup.less'
        }
    },
    updater: {
        files: {
            '<%= path.css.updater %>/updater.css': '<%= path.less.setup %>/_setup.less'
        }
    },
    documentation: {
        files: {
            '<%= path.doc %>/docs.css': '<%= path.doc %>/source/docs.less'
        }
    }
};

It would be great to see .less files as a source for a better debugging experience. Inside Chrome CSS Source Maps Enabled, as well already pressed the button to restore defaults - no luck.

Thank you

Answer 1

The issue was with npm packages. To resolve the issue I needed to:

1. Remove node_modules folder
2. Remove package-lock.json
3. Run npm install
4. Run grunt commands
5. After that I see sourcemap