Use of eval and Content Security Policy #695
Description
I am using Webpack Encore for a very minimalistic usage of JS and CSS and noticed the JS when using dev-server (encore dev-server) contains eval everywhere, therefore it doesn't work with any reasonable Content Security Policy, where eval is the first and most important thing to be prohibited.
It does work fine with encore production, and one could just not use any Content Security Policy for development, yet that may lead to breaks in production because the CSP was not tested / realistically set in development, so ideally no eval is ever used anywhere. I managed to solve the usage of eval by changing the value of devtool like shown in my configuration below:
var Encore = require('@symfony/webpack-encore');
Encore
.setOutputPath('public/assets/')
.setPublicPath('/assets')
.addEntry('app', './assets/js/app.js')
.splitEntryChunks()
.enableSingleRuntimeChunk()
.cleanupOutputBeforeBuild()
.enableVersioning(Encore.isProduction())
;
process.env.NODE_ENV = process.env.NODE_ENV || 'development';
Encore.configureWatchOptions(watchOptions => {
watchOptions.poll = 250; // check for changes every 250 ms
});
encoreConfig = Encore.getWebpackConfig();
// This prevents the use of eval and makes
// webpack in development work with a Content-Security-Policy
encoreConfig.devtool = "source-map";
module.exports = encoreConfig;I found the solution in a webpack issue about the usage of eval in webpack, although there were multiple solutions there depending on what kind of packages people used, so finding that solution was a bit random.
I thought I would start a discussion here about making Webpack Encore work with a reasonable Content Security Policy by default, so the friction to implement a CSP becomes lower, and/or to add documentation about how one can configure Encore to work without eval and with a CSP. I am also not sure if my above approach is the only way of removing eval, or if devtool can be set through the Encore object. In general I think it would be nice to factor in the usage of CSP, and I could help with documentation if needed.