export-a-single-library-module-automatically-with-webpackdeprecated

Export a single library module automatically with Webpack

Usage no npm install needed!

<script type="module">
  import exportASingleLibraryModuleAutomaticallyWithWebpack from 'https://cdn.skypack.dev/export-a-single-library-module-automatically-with-webpack';
</script>

README

Export a single library module automatically with Webpack

Setting up the environment

Install the dependencies

npm install

Creating a Bundle of library

npx webpack

Directory structure

.
├── dist/                   # The folder in which webpack packages the built version of library.
│   ├── sample.sub1.Bar.js
│   ├── sample.sub1.Bar.js
│   ├── sample.sub2.Baz.js
│   └── sample.sub2.Qux.js
├── src/                    # The folder in which all of library source.
│   ├── sub1/               # Namespace of myLib.sub1
│   │   ├── Bar.js          # Bar class module
│   │   └── Foo.js          # Foo class module
│   └── sub2/               # Namespace of myLib.sub2
│       ├── Baz.js          # Baz class module
│       └── Qux.js          # Qux class module
├── example/                # Example of working library
├── webpack.config.js       # Configuration file that webpack uses to build library
└── package.json            # Configuration file for Project metadata, dependencies and build scripts

Work Example

Creating a Bundle of example

cd ./example
../node_modules/webpack/bin/webpack.js

Open ./example/index.html in the browser and check with the console

Example source code

import Foo from 'sample.sub1.Foo';
import Bar from 'sample.sub1.Bar';
import Baz from 'sample.sub2.Baz';
import Qux from 'sample.sub2.Qux';

print(Foo.name());
print(Bar.name());
print(Baz.name());
print(Qux.name());

function print(str) {
  const p = document.createElement('p');
  p.textContent = str;
  document.body.appendChild(p);
}