You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/guides/author-libraries.md
+8-4Lines changed: 8 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -61,7 +61,7 @@ __src/ref.json__
61
61
62
62
__src/index.js__
63
63
64
-
```javascript
64
+
```js
65
65
import_from'lodash';
66
66
importnumReffrom'./ref.json';
67
67
@@ -80,7 +80,7 @@ export function wordToNum(word) {
80
80
81
81
The usage specification for the library use will be as follows:
82
82
83
-
```javascript
83
+
```js
84
84
// ES2015 module import
85
85
import*aswebpackNumbersfrom'webpack-numbers';
86
86
// CommonJS module require
@@ -142,7 +142,7 @@ We can start with this basic webpack configuration:
142
142
143
143
__webpack.config.js__
144
144
145
-
```javascript
145
+
```js
146
146
var path =require('path');
147
147
148
148
module.exports= {
@@ -240,6 +240,8 @@ __webpack.config.js__
240
240
};
241
241
```
242
242
243
+
T> Note that the `library` setup is tied to the `entry` configuration. For most libraries, specifying a single entry point is sufficient. While [multi-part libraries](https://github.com/webpack/webpack/tree/master/examples/multi-part-library) are possible, it is simpler to expose partial exports through an [index script](https://stackoverflow.com/questions/34072598/es6-exporting-importing-in-index-file) that serves as a single entry point. Using an `array` as an `entry` point for a library is __not recommended__.
244
+
243
245
This exposes your library bundle available as a global variable named `webpackNumbers` when imported. To make the library compatible with other environments, add `libraryTarget` property to the config. This will add the different options about how the library can be exposed.
244
246
245
247
__webpack.config.js__
@@ -305,6 +307,8 @@ Or, to add as standard module as per [this guide](https://github.com/dherman/def
305
307
306
308
The key `main` refers to the [standard from `package.json`](https://docs.npmjs.com/files/package.json#main), and `module` to [a](https://github.com/dherman/defense-of-dot-js/blob/master/proposal.md)[proposal](https://github.com/rollup/rollup/wiki/pkg.module) to allow the JavaScript ecosystem upgrade to use ES2015 modules without breaking backwards compatibility.
307
309
308
-
W> `module`will point to a module that has ES2015 module syntax but otherwise only syntax features that browser/node supports.
310
+
W> The `module`property should point to a script that utilizes ES2015 module syntax but no other syntax features that aren't yet supported by browsers or node. This enables
309
311
310
312
Now you can [publish it as an npm package](https://docs.npmjs.com/getting-started/publishing-npm-packages) and find it at [unpkg.com](https://unpkg.com/#/) to distribute it to your users.
313
+
314
+
T> To expose stylesheets associated with your library, the [`ExtractTextPlugin`](/plugins/extract-text-webpack-plugin) should be used. Users can then consume and load these as they would any other stylesheet.
0 commit comments