Home > @lynx-js/externals-loading-webpack-plugin > ExternalValue > libraryName

ExternalValue.libraryName property

The name of the library. Same as https://webpack.js.org/configuration/externals/\#string.

By default, the library name is the same as the externals key. For example:

The config

ExternalsLoadingPlugin({
  externals: {
    lodash: {
      url: '……',
    }
  }
})

Will generate the following webpack externals config:

externals: {
  lodash: 'lynx[Symbol.for("__LYNX_EXTERNAL_GLOBAL__")].lodash',
}

If one external bundle contains multiple modules, should set the same library name to ensure it's loaded only once. For example:

ExternalsLoadingPlugin({
  externals: {
    lodash: {
      libraryName: 'Lodash',
      url: '……',
    },
    'lodash-es': {
      libraryName: 'Lodash',
      url: '……',
    }
  }
})

Will generate the following webpack externals config:

externals: {
  lodash: 'lynx[Symbol.for("__LYNX_EXTERNAL_GLOBAL__")].Lodash',
  'lodash-es': 'lynx[Symbol.for("__LYNX_EXTERNAL_GLOBAL__")].Lodash',
}

You can pass an array to specify subpath of the external. Same as https://webpack.js.org/configuration/externals/\#string-1. For example:

ExternalsLoadingPlugin({
  externals: {
    preact: {
      libraryName: ['ReactLynx', 'Preact'],
      url: '……',
    },
  }
})

Will generate the following webpack externals config:

externals: {
  preact: 'lynx[Symbol.for("__LYNX_EXTERNAL_GLOBAL__")].ReactLynx.Preact',
}

Signature:

libraryName?: string | string[];

Example

Lodash

Except as otherwise noted, this work is licensed under a Creative Commons Attribution 4.0 International License, and code samples are licensed under the Apache License 2.0.