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 `

` tag (for the `title` property) and that `Heading` nodes are represented as ``. | | [math](./themes/math) | Provides styling of math nodes using MathJax fonts and styles. Use this if there is any likely to be math content, i.e. `MathFragment` and/or `MathBlock` nodes, in documents that your theme targets. | | [pages](./themes/pages) | Provides a [`@media print` CSS at-rule](https://developer.mozilla.org/en-US/docs/Web/CSS/@page) to modify properties when printing a document e.g. to PDF. | | [person](./themes/person) | Provides styling of `Person` nodes e.g the `authors` of an article, or authors for each `citation` in it's `references`. | @@ -435,15 +434,15 @@ Several utility functions are provided in the [`util`](./src/util) module for tr ### ready(func) Register a function to be executed when the DOM is fully loaded. -**Kind**: global function +**Kind**: global function **Detail**: Use this to wrap calls to the DOM selection and manipulation functions -to be sure that the DOM is ready before working on it. +to be sure that the DOM is ready before working on it. | Param | Type | Description | | --- | --- | --- | | func | 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') //
//
``` -**Example** *(As above but using an object to specify attributes)* +**Example** *(As above but using an object to specify attributes)* ```js create('figure', { @@ -537,7 +536,7 @@ create('figure', { itemtype: translate(':--Figure') }) ``` -**Example** *(Create a Person with a name property)* +**Example** *(Create a Person with a name property)* ```js create(':--Person', create('span :--name', 'John Doe')) @@ -550,31 +549,31 @@ create(':--Person', create('span :--name', 'John Doe')) ### tag(target, [value]) ⇒ 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 } }