Next.js: webpack.DefinePlugin is not working on next.config.js

[hank7444]

next.config.js

pages/index.js

result

Does it mean I lost something @@?

[timneutkens]

Please see https://github.com/zeit/next.js/tree/canary/examples/with-universal-configuration

[mrsteele]

I wanna submit that this issue gets reopened.

While you have solved the underlining issue for @hank7444 there may be other use-cases and workflows that still depend on DefinePlugin.

All to say I believe the issue still stands that the variables defined in webpack.DefinePlugin do not exist in the bundled files.

[tgdn]

Completely agree, this is still not possible. ReferenceError is always thrown. @timneutkens your solution has caveats as says the readme

[Deval520]

why did you close this issue,what's the solution? i also met this problem too recently!

[Deval520]

what's the solution? i also met this problem too recently! @timneutkens

[makstr]

it works for me

const webpack = require('webpack'); // eslint-disable-line
const FRONTEND_ENV_KEYS = [
    'NODE_ENV',
    'IS_STATIC',
    'API_URL',
    'CONTENTFUL_SPACE',
    'CONTENTFUL_ACCESS_TOKEN'
];

const envPlugin = FRONTEND_ENV_KEYS.reduce(
    (result, key) =>
        Object.assign({}, result, {
            [`process.env.${key}`]: JSON.stringify(process.env[key])
        }),
    {}
);

module.exports = {
    webpack(cfg) {
        // make selected env vars avail on client
        cfg.plugins.push(new webpack.DefinePlugin(envPlugin));
        return cfg;
    }
    // exportPathMap: require('./next.exportPathMap').exportPathMap
};

[matthewmueller]

^ not sure why everyone downvoted this. it works fine and it's something I've been using in production for at least a year now.