postcss / postcss-url

PostCSS plugin to rebase url(), inline or copy asset.
MIT License
377 stars 60 forks source link

postcss-url causes CSP valolation when url is set to 'inline' #182

Open HesamSe opened 8 months ago

HesamSe commented 8 months ago

I want to embed my font and image files into my js file using postcss-url. Here is my postcss config:

module.exports = {
    plugins: {
        tailwindcss: {
            config: join(__dirname, 'tailwind.config.js'),
        },
        autoprefixer: {},
        cssnano: {},
        'postcss-import': {},
        'postcss-url': {
            url: "inline",
            maxSize: 128 * 1024,
            useHash: true,
        }
    },
};

Everything works fine in development mode. But when I moved built files to the server, I faced this error in browser:

main.195fbc3377ced840.js:2 Refused to apply inline style because it violates the following Content Security Policy directive: "default-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.