403 error when NEXT_IMAGE_ALLOWED_DOMAINS is declared in netlify.toml

[mfgredo]

Describe the bug
Environment variable NEXT_IMAGE_ALLOWED_DOMAINS declared in netlify.toml for image handling is ignored. If it's declared in Netlify UI works fine.

or

gives a 403 error "Image is not from a permitted domain" ❌

no "Image is not from a permitted domain" error ✔

To Reproduce
Repository: https://github.com/Marcelo-Figueiredo/next-plugin-issue
Steps to reproduce the behavior:

1. Create a new next app
2. have a next/image component with src="https://randomuser.me/api/portraits/men/75.jpg"
3. Set the NEXT_IMAGE_ALLOWED_DOMAINS = "randomuser.me" variable in netlify.toml
4. Deploy to netlify with essential plugin (403 error)
5. Set variables in Netlify UI
6. Re-deploy (no 403 error)

Expected behavior
There should be no error if NEXT_IMAGE_ALLOWED_DOMAINS is declared in netlify.toml

Versions

• Next.js: 10.0.6

If you're using file-based installation

• netlify.toml:

[build]
  command = "yarn build"
  publish = "out"

[build.environment]
  NEXT_IMAGE_ALLOWED_DOMAINS = "randomuser.me"
  FORCE_WEBP_OUTPUT = "true"
  NODE_VERSION = "12.18.2"
  YARN_VERSION = "1.19.1"
  NETLIFY_USE_YARN = "true"

[ascorbic]

Hi. This is apparently a known issue with env vars in the toml that I didn't know about until today! I will update our docs to make that clear, and then look into a better way of handling this config.

[ascorbic]

We've released a new version of the plugin that no longer needs the env var, and instead can use the value from the next config.

[mfgredo]

Since netlify UI plugin hasn't updated yet i've added it in netlify.toml and can confirm the issue is gone!

Thank you, awesome work!

Closing.