diff --git a/CHANGELOG.md b/CHANGELOG.md index 9bb8b295b7..caa4024593 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,24 @@ +## [2.2.5](https://github.com/stencila/thema/compare/v2.2.4...v2.2.5) (2020-04-09) + + +### Bug Fixes + +* **Build:** Fix `lib` module generation from Webpack ([ae460a6](https://github.com/stencila/thema/commit/ae460a6666248ca46ac9edf91bcf6cefa3ff1095)) + +## [2.2.4](https://github.com/stencila/thema/compare/v2.2.3...v2.2.4) (2020-04-09) + + +### Bug Fixes + +* **Build:** Use Webpack for all build targets for consistency ([99606f9](https://github.com/stencila/thema/commit/99606f965ce264566800b644eb1331e3c0b72251)) + +## [2.2.3](https://github.com/stencila/thema/compare/v2.2.2...v2.2.3) (2020-04-08) + + +### Bug Fixes + +* **Build:** Fix ts-node theme import failing package genereation ([2981366](https://github.com/stencila/thema/commit/2981366704b4fb4c348cd88d740be42d4c73df41)) + ## [2.2.2](https://github.com/stencila/thema/compare/v2.2.1...v2.2.2) (2020-04-07) diff --git a/README.md b/README.md index a882f689d3..b8650850a9 100644 --- a/README.md +++ b/README.md @@ -132,7 +132,6 @@ Extensions provide styling, and potentially interactivity, for node types that d | [cite-apa](./themes/cite-apa) | Provides styling for in-text citations and bibliographies in accordance with the [American Psychological Association (APA) style](https://en.wikipedia.org/wiki/APA_style). | | [cite-mla](./themes/cite-mla) | Provides styling for in-text citations and bibliographies in accordance with the [Modern Language Association (MLA) style](https://style.mla.org/). | | [code](./themes/code) | Provides syntax highlighting for `CodeFragment` and `CodeBlock` nodes using [Prism](https://prismjs.com/). Will not style executable node types like `CodeExpression` and `CodeChunk` which are styled by the base Stencila Web Components. | -| [headings](./themes/headings) | A temporary extensions that changes the way that `Heading` nodes are represented. Ensures that there is only one `
function
| Function to register |
-**Example**
+**Example**
```js
ready(() => {
// Use other DOM manipulation functions here
@@ -454,23 +453,23 @@ ready(() => {
### first([elem], selector) ⇒ Element
\| null
Select the first element matching a CSS selector.
-**Kind**: global function
-**Returns**: Element
\| null
- An `Element` or `null` if no match
+**Kind**: global function
+**Returns**: Element
\| null
- An `Element` or `null` if no match
**Detail**: This function provides a short hand for `querySelector` but
also allowing for the use of semantic selectors.
-You can use it for the whole document, or scoped to a particular element.
+You can use it for the whole document, or scoped to a particular element.
| Param | Type | Description |
| --- | --- | --- |
| [elem] | Element
| The element to query (defaults to the `window.document`) |
| selector | string
| The selector to match |
-**Example** *(Select the first element from the document matching selector)*
+**Example** *(Select the first element from the document matching selector)*
```js
first(':--CodeChunk')
```
-**Example** *(Select the first element within an element matching the selector)*
+**Example** *(Select the first element within an element matching the selector)*
```js
first(elem, ':--author')
@@ -480,23 +479,23 @@ first(elem, ':--author')
### select([elem], selector) ⇒ Array.<Element>
Select all elements matching a CSS selector.
-**Kind**: global function
-**Returns**: Array.<Element>
- An array of elements
+**Kind**: global function
+**Returns**: Array.<Element>
- An array of elements
**Detail**: Provides a short hand for using `querySelectorAll` but
also allowing for the use of semantic selectors. You can use it for
-the whole document, or scoped to a particular element.
+the whole document, or scoped to a particular element.
| Param | Type | Description |
| --- | --- | --- |
| [elem] | Element
| The element to query (defaults to the `window.document`) |
| selector | string
| The selector to match |
-**Example** *(Select all elements from the document matching selector)*
+**Example** *(Select all elements from the document matching selector)*
```js
select(':--CodeChunk')
```
-**Example** *(Select all elements within an element matching the selector)*
+**Example** *(Select all elements within an element matching the selector)*
```js
select(elem, ':--author')
@@ -506,13 +505,13 @@ select(elem, ':--author')
### create([spec], [attributes], ...children) ⇒ Element
Create a new element.
-**Kind**: global function
+**Kind**: global function
**Detail**: This function allows creation of new elements using either a
(a) HTML string (b) CSS selector like string, or (c) an `Element`.
CSS selectors are are convenient way to create elements with attributes,
particularly Microdata elements. They can be prone to syntax errors however.
Alternatively, the second argument can
-be an object of attribute name:value pairs.
+be an object of attribute name:value pairs.
| Param | Type | Description |
| --- | --- | --- |
@@ -520,14 +519,14 @@ be an object of attribute name:value pairs.
| [attributes] | object
\| undefined
\| null
\| boolean
\| number
\| string
\| Element
| Attributes for the element. |
| ...children | undefined
\| null
\| boolean
\| number
\| string
\| Element
| Child nodes to to add as text content or elements. |
-**Example** *(Create a <figure> with id, class and itemtype attributes)*
+**Example** *(Create a <figure> with id, class and itemtype attributes)*
```js
create('figure #fig1 .fig :--Figure')
// string
\| Element
Get or set the tag name of an element.
-**Kind**: global function
+**Kind**: global function
**Returns**: string
\| Element
- The lowercase tag name when getting,
- a new element when setting.
+ a new element when setting.
**Detail**: Caution must be used when setting the tag. This function
does not actually change the tag of the element (that is not possible)
but instead returns a new `Element` that is a clone of the original apart
from having the new tag name. Use the `replace` function where necessary
-in association with this function.
+in association with this function.
| Param | Type | Description |
| --- | --- | --- |
| target | Element
| The element to get or set the tag |
| [value] | string
| The value of the tag (when setting) |
-**Example** *(Get the tag name as a lowercase string)*
+**Example** *(Get the tag name as a lowercase string)*
```js
tag(elem) // "h3"
```
-**Example** *(Setting the tag actually returns a new element)*
+**Example** *(Setting the tag actually returns a new element)*
```js
tag(tag(elem, 'h2')) // "h2"
```
-**Example** *(Change the tag name of an element)*
+**Example** *(Change the tag name of an element)*
```js
replace(elem, tag(elem, 'h2'))
@@ -584,8 +583,8 @@ replace(elem, tag(elem, 'h2'))
### attrs(target, [attributes]) ⇒ object
\| undefined
Get or set the attributes of an element
-**Kind**: global function
-**Returns**: object
\| undefined
- The attributes of the element when getting, `undefined` when setting
+**Kind**: global function
+**Returns**: object
\| undefined
- The attributes of the element when getting, `undefined` when setting
| Param | Type | Description |
| --- | --- | --- |
@@ -597,8 +596,8 @@ Get or set the attributes of an element
### attr(target, name, [value]) ⇒ string
\| null
Get or set the value of an attribute on an element.
-**Kind**: global function
-**Returns**: string
\| null
- a `string` if the attribute exists, `null` if does not exist, or when setting
+**Kind**: global function
+**Returns**: string
\| null
- a `string` if the attribute exists, `null` if does not exist, or when setting
| Param | Type | Description |
| --- | --- | --- |
@@ -606,12 +605,12 @@ Get or set the value of an attribute on an element.
| name | string
| The name of the attribute |
| [value] | string
| The value of the attribute (when setting) |
-**Example** *(Set an attribute value)*
+**Example** *(Set an attribute value)*
```js
attr(elem, "attr", "value")
```
-**Example** *(Get an attribute)*
+**Example** *(Get an attribute)*
```js
attr(elem, "attr") // "value"
@@ -621,21 +620,21 @@ attr(elem, "attr") // "value"
### text(target, [value]) ⇒ string
\| null
\| undefined
Get or set the text content of an element.
-**Kind**: global function
+**Kind**: global function
**Returns**: string
\| null
\| undefined
- `null` if there is no text content,
- `undefined` when setting
+ `undefined` when setting
| Param | Type | Description |
| --- | --- | --- |
| target | Element
| The element to get or set the text content |
| [value] | string
| The value of the text content (when setting) |
-**Example** *(Set the text content)*
+**Example** *(Set the text content)*
```js
text(elem, "text content")
```
-**Example** *(Get the text content)*
+**Example** *(Get the text content)*
```js
text(elem) // "text content"
@@ -645,7 +644,7 @@ text(elem) // "text content"
### append(target, ...elems)
Append new child elements to an element.
-**Kind**: global function
+**Kind**: global function
| Param | Type | Description |
| --- | --- | --- |
@@ -657,10 +656,10 @@ Append new child elements to an element.
### prepend(target, ...elems)
Prepend new child elements to an element.
-**Kind**: global function
+**Kind**: global function
**Detail**: When called with multiple elements to prepend
will maintain the order of those elements (at the top
-of the target element).
+of the target element).
| Param | Type | Description |
| --- | --- | --- |
@@ -672,7 +671,7 @@ of the target element).
### before(target, ...elems)
Insert new elements before an element.
-**Kind**: global function
+**Kind**: global function
| Param | Type | Description |
| --- | --- | --- |
@@ -684,7 +683,7 @@ Insert new elements before an element.
### after(target, ...elems)
Insert new elements after an element.
-**Kind**: global function
+**Kind**: global function
| Param | Type | Description |
| --- | --- | --- |
@@ -696,7 +695,7 @@ Insert new elements after an element.
### replace(target, ...elems)
Replace an element with a new element.
-**Kind**: global function
+**Kind**: global function
| Param | Type | Description |
| --- | --- | --- |
@@ -708,17 +707,17 @@ Replace an element with a new element.
### wrap(target, elem)
Wrap an element with a new element.
-**Kind**: global function
+**Kind**: global function
**Detail**: This function can be useful if you need
to create a container element to more easily style
-a type of element.
+a type of element.
| Param | Description |
| --- | --- |
| target | The element to wrap |
| elem | The element to wrap it in |
-**Example** *(Wrap all figure captions in a <div>)*
+**Example** *(Wrap all figure captions in a <div>)*
```js
select(':--Figure :--caption')
diff --git a/package-lock.json b/package-lock.json
index 87f19a01d8..b724373e7e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "@stencila/thema",
- "version": "2.2.2",
+ "version": "2.2.5",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@@ -2916,12 +2916,6 @@
"integrity": "sha512-KYyTT/T6ALPkIRd2Ge080X/BsXvy9O0hcWTtMWkPvwAwF99+vn6Dv4GzrFT/Nn1LePr+FFDbRXXlqmsy9lw2zA==",
"dev": true
},
- "@types/anymatch": {
- "version": "1.3.1",
- "resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz",
- "integrity": "sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==",
- "dev": true
- },
"@types/babel__core": {
"version": "7.1.4",
"resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.1.4.tgz",
@@ -3195,33 +3189,12 @@
"integrity": "sha512-wWKOClTTiizcZhXnPY4wikVAwmdYHp8q6DmC+EJUzAMsycb7HB32Kh9RN4+0gExjmPmZSAQjgURXIGATPegAvA==",
"dev": true
},
- "@types/source-list-map": {
- "version": "0.1.2",
- "resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz",
- "integrity": "sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA==",
- "dev": true
- },
"@types/stack-utils": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz",
"integrity": "sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw==",
"dev": true
},
- "@types/tapable": {
- "version": "1.0.5",
- "resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-1.0.5.tgz",
- "integrity": "sha512-/gG2M/Imw7cQFp8PGvz/SwocNrmKFjFsm5Pb8HdbHkZ1K8pmuPzOX4VeVoiEecFCVf4CsN1r3/BRvx+6sNqwtQ==",
- "dev": true
- },
- "@types/uglify-js": {
- "version": "3.0.4",
- "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-3.0.4.tgz",
- "integrity": "sha512-SudIN9TRJ+v8g5pTG8RRCqfqTMNqgWCKKd3vtynhGzkIIjxaicNAMuY5TRadJ6tzDu3Dotf3ngaMILtmOdmWEQ==",
- "dev": true,
- "requires": {
- "source-map": "^0.6.1"
- }
- },
"@types/unist": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.3.tgz",
@@ -3248,31 +3221,6 @@
"vfile-message": "*"
}
},
- "@types/webpack": {
- "version": "4.41.6",
- "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.6.tgz",
- "integrity": "sha512-iWRpV5Ej+8uKrgxp6jXz3v7ZTjgtuMXY+rsxQjFNU0hYCnHkpA7vtiNffgxjuxX4feFHBbz0IF76OzX2OqDYPw==",
- "dev": true,
- "requires": {
- "@types/anymatch": "*",
- "@types/node": "*",
- "@types/tapable": "*",
- "@types/uglify-js": "*",
- "@types/webpack-sources": "*",
- "source-map": "^0.6.0"
- }
- },
- "@types/webpack-sources": {
- "version": "0.1.6",
- "resolved": "https://registry.npmjs.org/@types/webpack-sources/-/webpack-sources-0.1.6.tgz",
- "integrity": "sha512-FtAWR7wR5ocJ9+nP137DV81tveD/ZgB1sadnJ/axUGM3BUVfRPx8oQNMtv3JNfTeHx3VP7cXiyfR/jmtEsVHsQ==",
- "dev": true,
- "requires": {
- "@types/node": "*",
- "@types/source-list-map": "*",
- "source-map": "^0.6.1"
- }
- },
"@types/ws": {
"version": "7.2.2",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-7.2.2.tgz",
@@ -8804,16 +8752,6 @@
"integrity": "sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==",
"dev": true
},
- "clean-webpack-plugin": {
- "version": "3.0.0",
- "resolved": "https://registry.npmjs.org/clean-webpack-plugin/-/clean-webpack-plugin-3.0.0.tgz",
- "integrity": "sha512-MciirUH5r+cYLGCOL5JX/ZLzOZbVr1ot3Fw+KcvbhUb6PM+yycqd9ZhIlcigQ5gl+XhppNmw3bEFuaaMNyLj3A==",
- "dev": true,
- "requires": {
- "@types/webpack": "^4.4.31",
- "del": "^4.1.1"
- }
- },
"cli-boxes": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-2.2.0.tgz",
@@ -11990,50 +11928,6 @@
}
}
},
- "del": {
- "version": "4.1.1",
- "resolved": "https://registry.npmjs.org/del/-/del-4.1.1.tgz",
- "integrity": "sha512-QwGuEUouP2kVwQenAsOof5Fv8K9t3D8Ca8NxcXKrIpEHjTXK5J2nXLdP+ALI1cgv8wj7KuwBhTwBkOZSJKM5XQ==",
- "dev": true,
- "requires": {
- "@types/glob": "^7.1.1",
- "globby": "^6.1.0",
- "is-path-cwd": "^2.0.0",
- "is-path-in-cwd": "^2.0.0",
- "p-map": "^2.0.0",
- "pify": "^4.0.1",
- "rimraf": "^2.6.3"
- },
- "dependencies": {
- "globby": {
- "version": "6.1.0",
- "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
- "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
- "dev": true,
- "requires": {
- "array-union": "^1.0.1",
- "glob": "^7.0.3",
- "object-assign": "^4.0.1",
- "pify": "^2.0.0",
- "pinkie-promise": "^2.0.0"
- },
- "dependencies": {
- "pify": {
- "version": "2.3.0",
- "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
- "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
- "dev": true
- }
- }
- },
- "pify": {
- "version": "4.0.1",
- "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
- "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
- "dev": true
- }
- }
- },
"delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -17969,32 +17863,6 @@
"integrity": "sha1-iVJojF7C/9awPsyF52ngKQMINHA=",
"dev": true
},
- "is-path-cwd": {
- "version": "2.2.0",
- "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz",
- "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==",
- "dev": true
- },
- "is-path-in-cwd": {
- "version": "2.1.0",
- "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-2.1.0.tgz",
- "integrity": "sha512-rNocXHgipO+rvnP6dk3zI20RpOtrAM/kzbB258Uw5BWr3TpXi861yzjo16Dn4hUox07iw5AyeMLHWsujkjzvRQ==",
- "dev": true,
- "requires": {
- "is-path-inside": "^2.1.0"
- },
- "dependencies": {
- "is-path-inside": {
- "version": "2.1.0",
- "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-2.1.0.tgz",
- "integrity": "sha512-wiyhTzfDWsvwAW53OBWF5zuvaOGlZ6PwYxAbPVDhpm+gM09xKQGjBq/8uYN12aDvMxnAnq3dxTyoSoRNmg5YFg==",
- "dev": true,
- "requires": {
- "path-is-inside": "^1.0.2"
- }
- }
- }
- },
"is-path-inside": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.1.tgz",
diff --git a/package.json b/package.json
index a07e583dc3..4cec28d7e6 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@stencila/thema",
- "version": "2.2.2",
+ "version": "2.2.5",
"description": "Semantic themes for use with encoda (https://github.com/stencila/encoda)",
"files": [
"/dist"
@@ -22,12 +22,12 @@
"check:themes": "ts-node --files src/scripts/themes.ts check '*'",
"build": "npm run build:browser && npm run build:lib",
"build:browser": "webpack --mode production && tsc --emitDeclarationOnly --project tsconfig.browser.json",
- "build:lib": "tsc --project tsconfig.lib.json",
+ "build:lib": "webpack --mode production --env.target=lib",
"dev": "webpack-dev-server --mode development --hot --open",
"docs": "npm run docs:readme && npm run docs:gallery && npm run docs:app",
"docs:readme": "ts-node --files src/scripts/readme.ts",
"docs:gallery": "ts-node --files src/scripts/gallery.ts",
- "docs:app": "webpack --mode production --env.docs=true",
+ "docs:app": "webpack --mode production --env.target=docs",
"lint": "npm run lint:styles && npm run lint:scripts",
"lint:fix": "npm run lint:styles -- --fix && npm run lint:scripts -- --fix",
"lint:styles": "stylelint './src/**/*.css'",
@@ -79,7 +79,6 @@
"argos-cli": "0.1.3",
"autoprefixer": "9.7.4",
"chromedriver": "80.0.1",
- "clean-webpack-plugin": "3.0.0",
"css-loader": "3.4.2",
"cssnano": "4.1.10",
"cssnano-preset-default": "4.0.7",
@@ -207,7 +206,7 @@
},
"husky": {
"hooks": {
- "pre-commit": "npm run update:selectors && npm run lint:scripts && pretty-quick --staged",
+ "pre-commit": "npm run update:selectors && npm run docs:readme && npm run lint:scripts && pretty-quick --staged",
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
},
diff --git a/src/browser/index.ts b/src/browser/index.ts
index ed23bb736c..c6ee235d71 100644
--- a/src/browser/index.ts
+++ b/src/browser/index.ts
@@ -1,5 +1,4 @@
import { themes } from '../themes'
-import { version } from '../../package.json'
export { themes }
@@ -8,7 +7,7 @@ export interface ThemaAssets {
scripts: string[]
}
-const themaMajor = version.split('.')[0]
+const themaMajor = process.env.npm_package_version?.split('.')[0]
/**
* The path to a theme in this package
diff --git a/src/scripts/readme.ts b/src/scripts/readme.ts
index 40a6030a8b..aa347ec2c1 100644
--- a/src/scripts/readme.ts
+++ b/src/scripts/readme.ts
@@ -21,7 +21,7 @@ import path from 'path'
import * as typescript from 'typescript'
import { promisify } from 'util'
import { extensions } from '../extensions'
-import { themes } from '../themes'
+import { themes } from '../themes/index'
const readFile = promisify(fs.readFile)
const writeFile = promisify(fs.writeFile)
diff --git a/webpack.config.js b/webpack.config.js
index 06f51f1aef..20dd255add 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,9 +1,7 @@
const globby = require('globby')
const path = require('path')
-
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const FileManagerPlugin = require('filemanager-webpack-plugin')
-const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const { DefinePlugin } = require('webpack')
@@ -25,18 +23,23 @@ const fileLoaderOutputPath = (url, resourcePath, context) => {
return `${relativePath}`
}
+const browserEntries = ['./src/**/*.{css,ts,ttf,woff,woff2}', '!**/lib/**/*.ts']
+
+const libEntries = ['./src/lib/**/*.ts']
+
module.exports = (env = {}, { mode }) => {
- const isDocs = env.docs === 'true'
+ // Build target, can be one of: [`browser` | 'lib' | 'docs']
+ const target = env.target || 'browser'
+ const isDocs = env.target === 'docs'
const isDevelopment = mode === 'development'
const contentBase = isDocs ? 'docs' : 'dist'
const entries = [
- './src/**/*.{css,ts,ttf,woff,woff2}',
+ ...(target === 'lib' ? libEntries : browserEntries),
// Don’t compile test files for package distribution
'!**/*.{d,test}.ts',
// These files make use of Node APIs, and do not need to be packaged for Browser targets
'!**/scripts/*.ts',
- '!**/lib/**/*.ts',
'!**/extensions/math/update.ts',
'!**/extensions/extensions.ts',
// Don’t build HTML demo files for package distribution
@@ -89,20 +92,29 @@ module.exports = (env = {}, { mode }) => {
extensions: ['.ts', '.tsx', '.js', '.css', '.html']
},
mode: mode || 'development',
+ target: target === 'lib' ? 'node' : 'web',
output: {
path: path.resolve(__dirname, contentBase),
publicPath: ASSET_PATH,
- filename: '[name].js'
+ filename: '[name].js',
+ library: 'thema',
+ libraryTarget: 'umd',
+ umdNamedDefine: true
+ },
+ node: {
+ __dirname: false
},
devServer: {
contentBase: path.join(__dirname, contentBase),
overlay: true
},
plugins: [
- new CleanWebpackPlugin(),
new DefinePlugin({
'process.env.ASSET_PATH': JSON.stringify(ASSET_PATH),
- 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
+ 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+ 'process.env.npm_package_version': JSON.stringify(
+ process.env.npm_package_version
+ )
}),
new MiniCssExtractPlugin(),
...docsPlugins,
@@ -126,7 +138,9 @@ module.exports = (env = {}, { mode }) => {
use: {
loader: 'ts-loader',
options: {
- configFile: 'tsconfig.browser.json',
+ configFile: `tsconfig.${
+ target === 'lib' ? 'lib' : 'browser'
+ }.json`,
experimentalWatchApi: true
}
}