How to override `devtool` webpack property ?

[stevebeauge]

When debugging in the browser, I get a lot of React cross origin errors.

According to their page, this may be fixed by setting devtool to cheap-module-source-map.

I try to set this attribute in the sfpx fast serve config, with no success.

I try both:

/*
 * User webpack settings file. You can add your own settings here.
 * Changes from this file will be merged into the base webpack configuration file.
 * This file will not be overwritten by the subsequent spfx-fast-serve calls.
 */

// you can add your project related webpack configuration here, it will be merged using webpack-merge module
// i.e. plugins: [new webpack.Plugin()]
const webpackConfig = {
    devtool: 'cheap-module-source-map'
};

// for even more fine-grained control, you can apply custom webpack settings using below function
const transformConfig = function (initialWebpackConfig) {
    // transform the initial webpack config here, i.e.
    // initialWebpackConfig.plugins.push(new webpack.Plugin()); etc.
    initialWebpackConfig.devtool = 'cheap-module-source-map';
    return initialWebpackConfig;
};

module.exports = {
    webpackConfig,
    transformConfig,
};

but none work. Still seeing source-map in the built config.

How can I fix that ?

SPFX version is 1.16.1 and spfx-fast-serve-helpers is 1.16.3

Thanks

[s-KaiNet]

I did a quick test and also was not able to set it, the question is what prevents it from applying. I haven't found yet. Will take a look later (will be busy next 4 weeks).

[s-KaiNet]

After trying it again, it seems that it works, when, for example when I tried inline-source-map, it created inlined source maps ax expected. Could you check it again?

[github-actions[bot]]

This issue has been automatically closed because we haven't received any response back. Please feel free to reopen if needed.