diff --git a/.github/workflows/node.js.yml b/.github/workflows/node.js.yml
new file mode 100644
index 00000000..ead65078
--- /dev/null
+++ b/.github/workflows/node.js.yml
@@ -0,0 +1,40 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: Node.js CI
+
+on:
+ push:
+ branches: [ master ]
+ pull_request:
+ branches: [ master ]
+
+jobs:
+ build:
+
+ runs-on: ubuntu-latest
+
+ strategy:
+ matrix:
+ node-version: [10.x, 12.x, 14.x]
+
+ steps:
+ - uses: actions/checkout@v2
+ - name: Use Node.js ${{ matrix.node-version }}
+ uses: actions/setup-node@v2-beta
+ with:
+ node-version: ${{ matrix.node-version }}
+ - name: Get yarn cache directory path
+ id: yarn-cache-dir-path
+ run: echo "::set-output name=dir::$(yarn cache dir)"
+ - uses: actions/cache@v2
+ id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
+ with:
+ path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+ key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+ restore-keys: |
+ ${{ runner.os }}-yarn-
+ - run: yarn
+ - run: yarn lintcheck
+ - run: yarn test --runInBand
+ - run: yarn e2e
diff --git a/.gitignore b/.gitignore
index 3c3629e6..93cab344 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
node_modules
+yarn-error.log
diff --git a/.npmignore b/.npmignore
new file mode 100644
index 00000000..471de961
--- /dev/null
+++ b/.npmignore
@@ -0,0 +1,8 @@
+*.peterbe
+*~
+dummy*
+hack*
+coverage
+/tests
+scripts/lintcheck.sh
+/.github
diff --git a/.prettierrc b/.prettierrc
index 1d2127c3..01769692 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,2 +1 @@
-semi: false
singleQuote: true
diff --git a/.travis.yml b/.travis.yml
deleted file mode 100644
index 9921d7de..00000000
--- a/.travis.yml
+++ /dev/null
@@ -1,16 +0,0 @@
-sudo: required
-language: node_js
-node_js:
- stable
-services:
- - docker
-branches:
- only:
- - master
- - /^greenkeeper/.*$/
-before_install:
- - docker build -t minimalcss:tests .
-script:
- - docker container run -it minimalcss:tests yarn tsc
- - docker container run -it minimalcss:tests yarn lintcheck
- - docker container run -it minimalcss:tests
diff --git a/CHANGELOG.md b/CHANGELOG.md
index a49092db..59e64331 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,7 +1,215 @@
+# 0.11.3
+
+* Cope with selectors with a `\` character before the `:`
+ [pull#426](https://github.com/peterbe/minimalcss/pull/426)
+
+# 0.11.2
+
+* Add a `.npmignore` to avoid shipping tests and backup files.
+
+# 0.11.1
+
+* Upgrade sub-dependency `find-my-way`
+ [pull#407](https://github.com/peterbe/minimalcss/pull/407)
+
+# 0.11.0
+
+* The main parameter `urls` can no be a string called just `url`. You just
+ need to either use `urls` (array) or `url` (string).
+
+* New `ignoreRequestErrors` option to ignore HTTP responses that are `>=400`.
+ [pull#365](https://github.com/peterbe/minimalcss/pull/365)
+ Thanks @Fgruntjes
+
+* (Chore) Switching from TravisCI to GitHub Actions
+
+# 0.10.0
+
+* Upgrade dependency on `puppeteer` to `^2.0.0`
+
+# 0.9.0
+
+* Ability to pass a list of whitelist selector regexes
+ [pull#344](https://github.com/peterbe/minimalcss/pull/344)
+ Thanks @AlexDubok
+
+* Upgrade dependency on `css-tree` to `1.0.0-alpha.37`
+
+* Upgrade dependency on `csso` to `~4.0.2`
+
+# 0.8.3
+
+* You can now render exclusively with JavaScript disabled.
+ [pull#312](https://github.com/peterbe/minimalcss/pull/312)
+ Thanks @VladislavTkachuk
+
+# 0.8.2
+
+* Big optimization. By looking up the "parent CSS selector" pre-emptively
+ it can quickly discard repeated "child CSS selectors".
+ [pull#296](https://github.com/peterbe/minimalcss/pull/296)
+
+# 0.8.1
+
+* Ignore `` and `` tags whose
+ `href` value was a `.css` extension.
+ [pull#275](https://github.com/peterbe/minimalcss/pull/275)
+ Thanks @nicolas-t
+
+# 0.8.0
+
+* By default, Service Workers are disabled. This new feature requires an
+ upgrade of puppeteer to `^1.8.0`.
+ [pull#265](https://github.com/peterbe/minimalcss/pull/265)
+
+* Ability to also extract the CSS of all `style` tags with the `styletags`
+ option.
+ [pull#260](https://github.com/peterbe/minimalcss/pull/260)
+ Thanks @jc275
+
+# 0.7.10
+
+* Not crash if the CSS contains multiple semicolons which crashes
+ csso (https://github.com/css/csso/issues/378)
+ [pull#259](https://github.com/peterbe/minimalcss/pull/259)
+ Thanks @jc275
+
+* Stylesheet `link` tags whose `href` URL contains a `#fragment-example`
+ would cause an error because puppeteer doesn't include it in the
+ `response.url()`.
+ [pull#255](https://github.com/peterbe/minimalcss/pull/255)
+ Thanks @jc275
+
+# 0.7.9
+
+* New option `ignoreJSErrors` to ignore possible JavaScript errors.
+ [pull#253](https://github.com/peterbe/minimalcss/pull/253)
+ Thanks @jc275
+
+# 0.7.8
+
+* New option `ignoreCSSErrors` to ignore possible CSS parsing errors.
+ [pull#249](https://github.com/peterbe/minimalcss/pull/249)
+ Thanks @stereobooster
+
+# 0.7.7
+
+* Throw explicit errors on invalid CSS
+ [pull#237](https://github.com/peterbe/minimalcss/pull/237)
+ Thanks @harrygreen
+
+# 0.7.6
+
+* List what timed out. Useful for debugging which resources failed.
+ [pull#199](https://github.com/peterbe/minimalcss/pull/199)
+ Thanks @stereobooster
+
+* Upgrade to puppeteer 1.4.0
+ [pull#214](https://github.com/peterbe/minimalcss/pull/214)
+
+# 0.7.5
+
+* Ability to pass an object of options to `csso.compress()`
+ [pull#167](https://github.com/peterbe/minimalcss/pull/167)
+ Thanks @usebaz
+
+# 0.7.4
+
+* Fix for logic of using the `--withoutjavascript` argument.
+ [pull#163](https://github.com/peterbe/minimalcss/pull/163)
+ Thanks @stereobooster
+
+* Upgrade `puppeteer` dependency to version 1.2.
+
+* Fix for `304 Not Modified` responses that actually don't redirect.
+ [pull#165](https://github.com/peterbe/minimalcss/pull/165)
+ Thanks @stereobooster
+
+# 0.7.3
+
+* Fix for pages that uses `data:text/css ...` as the `href` i `` tags.
+ [pull#159](https://github.com/peterbe/minimalcss/pull/159)
+
+# 0.7.2
+
+* Data URIs in external stylesheets lost the `data:` part.
+ [pull#153](https://github.com/peterbe/minimalcss/pull/153)
+ Thanks @stereobooster and @phiresky for reporting.
+
+# 0.7.1
+
+* Any query strings in URLs in CSS is now preserved.
+ [pull#148](https://github.com/peterbe/minimalcss/pull/148) Thanks @usebaz
+
+# 0.7.0
+
+* Important fix for how multiple external stylesheets are parsed in the exact
+ order the `` tags appear in the HTML.
+ [pull#131](https://github.com/peterbe/minimalcss/pull/131)
+
+* The response interceptor skips or includes resources based on
+ `responseType` instead of URL and filename.
+ [pull#118](https://github.com/peterbe/minimalcss/pull/118) Thanks @stereobooster
+
+# 0.6.3
+
+* Redirects, both of external style sheets and other URLs is now correctly
+ followed. [pull#106](https://github.com/peterbe/minimalcss/pull/106)
+
+* Remove `@media print` rules. [pull#101](https://github.com/peterbe/minimalcss/pull/101)
+
+* Switching to wait for [`networkidle0`](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagegotourl-options)
+ instead to allow the page slightly more time to finish more XHR and static
+ resources. [pull#87](https://github.com/peterbe/minimalcss/pull/87)
+
+# 0.6.2
+
+* All `@font-face` rules whose name is never mentioned in any remaining
+ selector is now deleted. [pull#81](https://github.com/peterbe/minimalcss/pull/81)
+
+* Rules inside `keyframe` at-rules are not analyzed.
+ [pull#83](https://github.com/peterbe/minimalcss/pull/83)
+
+# 0.6.1
+
+* Much better error handling. If a CSS file fails to download or some
+ JavaScript on the page throws an error, the minimalcss process now
+ exits immediately, closes the puppeteer instance, and triggers the
+ rejection on the main promise.
+ Thanks @stereobooster [pull#65](https://github.com/peterbe/minimalcss/pull/65)
+
+# 0.6.0
+
+* Supports setting `viewport`. Both via the cli and via the pure API.
+ Thanks @stereobooster [pull#64](https://github.com/peterbe/minimalcss/pull/64)
+ And works on the cli by passing a JSON string
+ [pull#78](https://github.com/peterbe/minimalcss/pull/78)
+
+# 0.5.1
+
+* Works with and requires puppeteer 1.0.0. [pull#74](https://github.com/peterbe/minimalcss/pull/74)
+ Thanks @jonathaningram
+
+# 0.5.0
+
+* Engine massively refactored by the author of
+ [csstree](https://github.com/csstree/csstree) and
+ [csso](https://github.com/css/csso)
+ himself; [@lahmatiy](https://github.com/lahmatiy)
+
+* The `minimalcss.minimize()` functions promise no longer contains a
+ `stylesheetAstObjects` objects. It wasn't clear which AST it should be.
+ Thanks again @lahmatiy
+
+* Redundant and never referred to `keyframes` get automatically removed.
+ [pull#57](https://github.com/peterbe/minimalcss/pull/57).
+
+* greenkeeper.io now helps maintain dependency upgrades.
+
# 0.4.0
-* Every URL you pass gets loaded twice. First *without Javascript* and then
- *with JavaScript* (and waiting for network to be idle). These means the
+* Every URL you pass gets loaded twice. First _without Javascript_ and then
+ _with JavaScript_ (and waiting for network to be idle). These means the
minimal CSS will contain CSS that was necessary **before** the page is fully
loaded as well.
Also, the engine has entirely changed. Instead of evaluating the DOM inside
@@ -84,7 +292,7 @@
* List of "dead obvious" selectors that don't need to be analyzed like
`*`, `body`, and
-`html`.
+ `html`.
* Clean up repeated important-comments in the concatenated CSS.
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 0632e794..3742e17e 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,14 +1,23 @@
# Contributing
-XXX Needs instructions how how to get up and running to do dev,
-linting and testing.
+The README has instructions about how to do testing and lint checking.
+Generally you do:
+
+```sh
+git clone https://github.com/peterbe/minimalcss.git
+cd minimalcss
+./bin/minimalcss.js https://news.ycombinator.com
+```
+
+If you make a PR, GitHub Actions will run unit tests, lint checks and end-to-end
+testing. Hopefully it's clear from any errors there what needs to be done.
## Style guide
All patches are expected to run [Prettier](https://github.com/prettier/prettier)
-as described and configured in the `package.json`'s `lint-staged` script.
-I.e. single quotes and no semicolons.
+as described and configured in the `.prettierrc`. You can run this with
+`yarn lintcheck`. There are no lint checking pre-commit git hooks.
Variables names should be camelCase and it's `someUrl` or `someCss` not
`someURL` or `someCSS`.
diff --git a/Dockerfile b/Dockerfile
deleted file mode 100644
index 630cd578..00000000
--- a/Dockerfile
+++ /dev/null
@@ -1,27 +0,0 @@
-FROM node:8
-
-RUN apt-get update && \
-apt-get install -yq gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 \
-libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 \
-libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 \
-libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 \
-ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget
-
-ADD yarn.lock /yarn.lock
-ADD package.json /package.json
-
-ENV NODE_PATH=/node_modules
-ENV PATH=$PATH:/node_modules/.bin
-RUN yarn
-
-# I don't know why, but unless you do this 'yarn add puppeteer', Chromium
-# won't be installed.
-# Why isn't that taken care of why the 'yarn' above?
-RUN yarn add puppeteer
-
-
-WORKDIR /app
-ADD . /app
-
-ENTRYPOINT ["/bin/bash", "/app/tests/run.sh"]
-CMD ["e2e"]
diff --git a/LICENSE b/LICENSE
index adc9379a..62daaab0 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,7 +1,7 @@
-Copyright 2017 James Long
+Copyright 2018 Peter Bengtsson
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
\ No newline at end of file
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
diff --git a/README.md b/README.md
index 8fce7154..0cfac370 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,9 @@
# minimalcss
-[](https://greenkeeper.io/)
+
[](https://www.npmjs.com/package/minimalcss)
[](#badge)
+[](https://renovateapp.com/)
A Node library to extract the minimal CSS used in a set of URLs with puppeteer.
Used to find what minimal CSS is needed to render on first load, even with
@@ -12,7 +13,7 @@ This minimal CSS is also known as [critical path CSS](https://developers.google.
and ultimately a web performance technique to make web pages load faster
at initial load.
-## What does it do?
+## What does it do
You supply a list of URLs that it opens (one at a time) and for each page
it downloads all external CSS files (e.g.
@@ -41,24 +42,24 @@ one "merged" and minified CSS payload.
Install:
-```
+```bash
yarn add minimalcss --dev
```
You can install it globally if you like:
-```
+```bash
yarn global add minimalcss
```
-```
+```bash
npm install [--save-dev|--global] minimalcss
```
Now you can run it:
-```shell
-$ ./node_modules/./bin/minimalcss https://example.com/ https://example.com/aboutus > minimal.min.css
+```bash
+./node_modules/.bin/minimalcss https://example.com/ https://example.com/aboutus > minimal.min.css
```
## Prior art
@@ -67,25 +68,24 @@ $ ./node_modules/./bin/minimalcss https://example.com/ https://example.com/about
special about `minimalcss` is that it uses the Chrome Headless browser.
* [penthouse](https://github.com/pocketjoso/penthouse) -
-uses [PhantomJS](http://phantomjs.org/) which is a headless WebKit browser.
-`PhantomJS` is [no longer maintained](https://groups.google.com/forum/m/#!topic/phantomjs/9aI5d-LDuNE).
-Supports only 1 URL at a time and can't you have to first save the CSS files
-it should process.
+ uses [puppeteer](https://github.com/GoogleChrome/puppeteer) (since version 1.0) and [CSSTree](https://github.com/csstree/csstree).
+ Supports only 1 URL at a time and can't you have to first save the CSS files
+ it should process.
* [critical](https://github.com/addyosmani/critical) - uses `penthouse`
-(see above) with its "flaws" meaning you can only do 1 URL (or HTML string)
-and you have to prepare the CSS files too.
+ (see above) with its "flaws" meaning you can only do 1 URL (or HTML string)
+ and you have to prepare the CSS files too.
* [UnCSS](https://github.com/giakki/uncss) - uses [jsdom](https://github.com/tmpvar/jsdom)
-to render and execute JavaScript. Supports supplying multiple URLs but still
-requires to manually supply the CSS files to process.
+ to render and execute JavaScript. Supports supplying multiple URLs but still
+ requires to manually supply the CSS files to process.
* [mincss](https://github.com/peterbe/mincss) - Python project that uses
-[lxml.html](http://lxml.de/lxmlhtml.html) to analyze the HTML statically
-(by doing a `GET` of the URL as if done by a server). I.e.
-it can't load the HTML as a real browser would and thus does not support a
-DOM with possible JavaScript mutations on load.
-It can optionally use `PhantomJS` to extract the HTML.
+ [lxml.html](http://lxml.de/lxmlhtml.html) to analyze the HTML statically
+ (by doing a `GET` of the URL as if done by a server). I.e.
+ it can't load the HTML as a real browser would and thus does not support a
+ DOM with possible JavaScript mutations on load.
+ It can optionally use `PhantomJS` to extract the HTML.
## Killer features
@@ -96,7 +96,7 @@ It can optionally use `PhantomJS` to extract the HTML.
[CSSTree](https://github.com/csstree/csstree) which are both high quality
projects that are solid and well tested.
-* The CSS selectors downloaded is compared to the DOM before *and* after
+* The CSS selectors downloaded is compared to the DOM before _and_ after
JavaScript code has changed the DOM. That means you can extract the
critical CSS needed to display properly before the JavaScript has kicked in.
@@ -104,13 +104,12 @@ It can optionally use `PhantomJS` to extract the HTML.
animations that they use and use this to delete keyframe definitions
that are no longer needed.
-## State of the project
-
-This is highly experimental.
-
-The goal is to expand the tooling with all the bells and whistles that
-`penthouse` and `critical` etc. has.
+* You can specify a [viewport](https://github.com/GoogleChrome/puppeteer/blob/v1.0.0/docs/api.md#pagesetviewportviewport),
+ which might cause the page to render slightly different. It does not
+ create the minimal CSS _only_ on DOM that is visible though.
+* If the CSS contains `@font-face { ... }` rules whose name is never
+ used in any remaining CSS selector, the whole `font-face` block is removed.
## Help needed
@@ -122,7 +121,7 @@ optimization work.
## API
```javascript
-const minimalcss = require('minimalcss')
+const minimalcss = require('minimalcss');
```
### Get version `minimalcss.version`
@@ -134,14 +133,16 @@ Just prints out the current version.
Returns a promise. The promise returns an object containing, amongst
other things, the minified minimal CSS as a string.
For example:
+
```javascript
minimalcss
- .minimize({ urls: ['http://peterbecom.dev/css-blocking/ultra-basic.html'] })
+ .minimize({ url: 'https://example.com/' })
.then(result => {
- console.log('OUTPUT', result.finalCss.length, result.finalCss)
-}).catch(error => {
- console.error(`Failed the minimize CSS: ${error}`)
-})
+ console.log('OUTPUT', result.finalCss.length, result.finalCss);
+ })
+ .catch(error => {
+ console.error(`Failed the minimize CSS: ${error}`);
+ });
```
That `result` object that is returned by the `minimize` function contains:
@@ -149,33 +150,128 @@ That `result` object that is returned by the `minimize` function contains:
* `finalCss` - the minified minimal CSS as a string.
* `stylesheetContents` - an object of stylesheet URLs as keys and their
content as text.
-* `stylesheetAstObjects` - an object of stylesheet URLs as keys and their
- AST as a plain object.
+
+Optionally, you can supply a list of URLs like this:
+
+```javascript
+minimalcss
+ .minimize({ urls: ['https://example.com/page1', 'https://example.com/page2'] })
+ ...
+```
+
+and `minimalcss` will try to merge the minimal critical CSS across all pages.
+But we aware that this can be "dangerous" because of the inherit order of CSS.
## API Options
Calling `minimalcss.run(options)` takes an object whose only mandatory
-key is `urls`. Other optional options are:
+key is `urls` or `url`. Other optional options are:
* `debug` - all console logging during page rendering are included in the
stdout. Also, any malformed selector that cause errors in `document.querySelector`
will be raised as new errors.
-* `skippable` - function wich takes
- [request](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#class-request)
+* `skippable` - function which takes
+ [request](https://pptr.dev/#?product=Puppeteer&show=api-class-httprequest)
as an argument and returns boolean. If it returns true then given request
will be aborted (skipped). Can be used to block requests to Google Analytics
etc.
* `loadimages` - If set to `true`, images will actually load.
-* `withoutjavascript` - If set to `true` it will *skip* loading the page first
+* `withoutjavascript` - If set to `false` it will _skip_ loading the page first
without JavaScript. By default `minimalcss` will evaluate the DOM as plain as
- can be, and then with JavaScript enabled *and* waiting for network activity
+ can be, and then with JavaScript enabled _and_ waiting for network activity
to be idle.
+* `disableJavaScript` - By default JavaScript is enabled. If set to `true` it will ignore `withoutjavascript` option and loading the page only one time without JavaScript.
* `browser` - Instance of a [Browser](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#class-browser), which will be used instead of launching another one.
* `userAgent` - specific user agent to use (string)
+* `viewport` - viewport object as specified in [page.setViewport](https://github.com/GoogleChrome/puppeteer/blob/v1.0.0/docs/api.md#pagesetviewportviewport)
+* `puppeteerArgs` - Args sent to puppeteer when launching. [List
+ of strings for headless Chrome](https://peter.sh/experiments/chromium-command-line-switches/).
+* `cssoOptions` - CSSO compress function [options](https://github.com/css/csso#compressast-options)
+* `timeout` - Maximum navigation time in milliseconds, defaults to 30 seconds, pass 0 to disable timeout.
+* `ignoreCSSErrors` - By default, any CSS parsing error throws an error in `minimalcss`. If you know it's safe to ignore (for example, third-party CSS resources), set this to `true`.
+* `ignoreJSErrors` - By default, any JavaScript error encountered by puppeteer
+* `ignoreRequestErrors` - When CSS files return 404 or another request error `minimalcss` will ignore this instead of throwing an error.
+will be thrown by `minimalcss`. If you know it's safe to ignore errors (for example, on
+third-party webpages), set this to `true`.
+* `styletags` - If set to `true`, on-page `
+```
+
+In this case the `@font-face { font-family: MyName; }` would be removed even
+though it's mentioned from somewhere else.
+
+### About Blobs
+
+If your document uses `Blob` to create injectable stylesheets into the DOM,
+`minimalcss` will _not_ be able to optimize that. It will be not be
+included in the final CSS.
+
## Development
-We use ES6+ with jsdoc comments and TypeScript to do static type checking, like [puppeeteer does](https://github.com/GoogleChrome/puppeteer/pull/986/files).
+First thing to get started, once you've cloned the repo is to install all
+the dependencies:
+
+```sh
+yarn
+```
+
+### Testing
-Run `tsc` to check types.
+Testing is done with [`jest`](https://facebook.github.io/jest/). At the
+beginning of every test, a static file server is started on `localhost`
+and a `puppeteer` browser instance is created for every test.
+
+To run the tests:
```sh
-yarn tsc
+yarn jest
```
+Best way to get into writing tests is to look at existing tests and copy.
+
### Prettier
All code is expected to conform with [Prettier](https://prettier.io/) according
@@ -204,15 +335,18 @@ to the the `.prettierrc` file in the root of the project.
To check that all your code conforms, run:
- yarn lintcheck
-
-## Caveats
+```sh
+yarn lintcheck
+```
-### A Warning About Blobs
+## Use without a server
-If your document uses `Blob` to create injectable stylesheets into the DOM, `minimalcss` will *not* be able to optimize that. It will be not be included in the final CSS.
+[This blog post](https://www.peterbe.com/plog/how-to-use-minimalcss-without-a-server)
+demonstrates technique to use `minimalcss` when you don't yet have a server.
+Using the `http-server` package you can start a server right before you run
+and shut down as soon as you're done.
## License
-Copyright (c) 2017-2018 [Peter Bengtsson](https://www.peterbe.com).
-See the [LICENSE](/LICENSE.md) file for license rights and limitations (MIT).
+Copyright (c) 2017-2020 [Peter Bengtsson](https://www.peterbe.com).
+See the [LICENSE](/LICENSE) file for license rights and limitations (MIT).
diff --git a/bin/minimalcss.js b/bin/minimalcss.js
index 749887fb..f76a4b39 100755
--- a/bin/minimalcss.js
+++ b/bin/minimalcss.js
@@ -1,48 +1,48 @@
#!/usr/bin/env node
-'use strict'
+'use strict';
-const { URL } = require('url')
-const fs = require('fs')
-const minimist = require('minimist')
-const minimalcss = eval('require')('../index')
-const filesize = require('filesize')
+const { URL } = require('url');
+const fs = require('fs');
+const minimist = require('minimist');
+const minimalcss = eval('require')('../index');
+const filesize = require('filesize');
-const args = process.argv.slice(2)
+const args = process.argv.slice(2);
const argv = minimist(args, {
boolean: [
- // "write",
- // "stdin",
'help',
'version',
'verbose',
'debug',
'loadimages',
- 'withoutjavascript'
+ 'styletags',
+ 'withoutjavascript',
+ 'nosandbox',
+ 'enableserviceworkers',
],
- string: ['output', 'skip'],
+ string: ['output', 'skip', 'viewport'],
default: {
// color: true,
- // "ignore-path": ".prettierignore"
},
alias: {
debug: 'd',
help: 'h',
version: 'v',
- output: 'o'
+ output: 'o',
},
- unknown: param => {
+ unknown: (param) => {
if (param.startsWith('-')) {
- console.warn('Ignored unknown option: ' + param + '\n')
- return false
+ console.warn('Ignored unknown option: ' + param + '\n');
+ return false;
}
- }
-})
+ },
+});
if (argv['version']) {
- console.log(minimalcss.version)
- process.exit(0)
+ console.log(minimalcss.version);
+ process.exit(0);
}
if (argv['help']) {
@@ -53,82 +53,104 @@ if (argv['help']) {
' --verbose Include a comment about the options and the date it was generated.\n' +
' --debug or -d Print all console logging during page rendering to stdout.\n' +
' --loadimages By default, all images are NOT downloaded. This reverses that.\n' +
+ ' --styletags By default, all
+
+
+