Skip to content

Enhancement of Webpack DefinePlugin to store defined things in actual variables

License

Notifications You must be signed in to change notification settings

lsagetlethias/define-variable-webpack-plugin

Repository files navigation


npm

deps node


define-variable-webpack-plugin

Enhancement of Webpack DefinePlugin to store defined things in actual variables.

Requirements

define-variable-webpack-plugin relies on webpack 4. It will be updated as needed on major updates of webpack.

Install

yarn add -D define-variable-webpack-plugin
# or
npm i --save-dev define-variable-webpack-plugin

Usage

FYI, the following examples are based on a Typescript code based application.

webpack.config

import { DefineVariablePlugin } from 'define-variable-webpack-plugin';
import { Configuration } from 'webpack';

const config: Configuration = {
    // ... your webpack configuration
    plugins: [
        new DefineVariablePlugin({
            myVar: JSON.stringify('test'),
            myWindowVar: {
                type: 'window', // can be: 'window', 'const' (default), 'global'
                value: JSON.string('foo'),
            }
        }),
    ],
}
export default config;

index.ts

// fetch the actual variables instead of pure replacement
import { dynamicImporter } from 'define-variable-webpack-plugin/dynamicImporter';

console.log(dynamicImporter.myVar); // 'test'
console.log(Object.entries(dynamicImporter)) // [ ['myVar', 'test'] ]

console.log(window.myWindowVar); // 'foo'
console.log('myWindowVar' in window); // true

This will generate a separated chunk with declared variables, loaded on demand by you application.

Maintainers


Lilian Saget-Lethias

About

Enhancement of Webpack DefinePlugin to store defined things in actual variables

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages