Files
vscode-extension-samples/webpack-sample/README.md

29 lines
1.5 KiB
Markdown
Raw Permalink Normal View History

2018-09-20 15:45:12 +02:00
# Webpack & Extensions
2018-09-19 17:54:55 +02:00
2018-09-20 15:45:12 +02:00
This is an extension that uses [https://webpack.js.org]() to bundle and minify its sources. Using webpack will help to reduce the install- and startup-time of large extensions because instead of hundreds of files, a single file is produced.
2018-09-19 17:54:55 +02:00
2018-09-20 15:45:12 +02:00
## Configuration
2018-09-19 17:54:55 +02:00
2020-06-24 17:22:59 -03:00
Webpack is configured in the [`webpack.config.js`](./webpack.config.js)-file. Find annotation inside the file itself or refer to the excellent webpack documentation: [https://webpack.js.org/configuration/](). In short, the config-files defines the entry point of the extension, to use TypeScript, to produce a commonjs-module, and what modules not to bundle.
2018-09-19 17:54:55 +02:00
2018-09-20 15:45:12 +02:00
## Scripts
2018-09-19 17:54:55 +02:00
2018-10-10 14:26:42 +02:00
The `scripts`-section of the [`package.json`](./package.json)-file has entries for webpack. Those compile TypeScript and produce the bundle as well as producing a minified production build. Note, that there is no dedicated TypeScript-script as webpack takes care of that.
2018-09-19 17:54:55 +02:00
2018-09-20 15:45:12 +02:00
## More
2018-09-19 17:54:55 +02:00
2018-09-20 15:45:12 +02:00
If you use `vscode-nls` to localize your extension that you likely also use `vscode-nls-dev` to create language bundles at build time. To support webpack, a loader has been added to vscode-nls-dev. Add the section below to the `modules/rules`-configuration.
2018-09-19 17:54:55 +02:00
2018-09-20 15:45:12 +02:00
```js
{
// vscode-nls-dev loader:
// * rewrite nls-calls
loader: 'vscode-nls-dev/lib/webpack-loader',
options: {
base: path.join(__dirname, 'src')
}
```
2018-09-19 17:54:55 +02:00
2018-09-20 15:45:12 +02:00
A good sample is the shared config built-in extensions use: https://github.com/Microsoft/vscode/blob/bf5b0585d2a8759541690b2c564b96cb604ff92e/extensions/shared.webpack.config.js#L29-L51