8

I am trying to adhere to the CSP directives in the bundled production code. We have a strict ContentSecurityPolicy in place which doesn't allow the eval() and its relatives like setTimeout(String), setInterval(String), and new Function(String). Therefore I am trying to remove such statements through webpack.config.js.

I am using webpack 4.28.0 and after seeing numerous guides online, I have tried the following in the webpack.config.js:

mode: 'production',
node: {
  global: false,
  fs: 'empty', // irrelevant for this example I think
}

// rest of code ... 

plugins: [
      new webpack.DefinePlugin({ // This was put in place because before I got window is undefined errors
        global: 'window'
      }),

// rest of code ... 

Also the devtool property is left unset (as per some guides I found online) even though I don't think it matters.

I am currently getting complains regarding the new Function(...) (see img below):

enter image description here

Here's the CSP error also:

enter image description here

I am not the most proficient in webpack, so in hopes of the rest of you being, I would like to ask you, is it even possible to do that through webpack? Have you stumbled upon such thing in the past and can you share some hints? Could it be Babel that's doing stuff?

Thank you in advance!

0 Answers0