Skip to content

Commit

Permalink
Merge pull request #16 from thescientist13/issue-14-add-ci-build-and-…
Browse files Browse the repository at this point in the history
…documentation-for-critical

Issue 14 add ci build and documentation for critical
  • Loading branch information
anthonygore authored May 12, 2018
2 parents a3b973d + b428c82 commit 5a916be
Show file tree
Hide file tree
Showing 10 changed files with 107 additions and 804 deletions.
29 changes: 29 additions & 0 deletions .circleci/config.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
version: 2
jobs:
build:
docker:
- image: thegreenhouse/nodejs-dev

working_directory: ~/repo

steps:
- checkout

# Download and cache dependencies
- restore_cache:
keys:
- v1-dependencies-{{ checksum "package.json" }}
# fallback to using the latest cache if no exact match is found
- v1-dependencies-

- run:
name: Install Project Dependencies
command: npm install

- run:
name: Run Tests
command: npm test

- run:
name: Run CI Build
command: npm run ci
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,5 @@ dist/
node_modules/
.idea/
npm-debug.log
test/**/build/
test/**/build/
build/
18 changes: 18 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ A fork of Critical Webpack Plugin.

This is simplified and runs after all files have been emitted so you can use it after Extract Text and HTML Webpack Plugin.

**Note**: [As **critical** itself has a dependency on puppeteer](https://github.com/addyosmani/critical/releases/tag/v1.0.0) in order to run Headless Chrome, consumers of this plugin will need to make sure that their build environment (local, CI, etc) where running webpack with this plugin has the necessary operating system packages installed. See this page for more information on [troubleshooting](https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md) puppeteer.

### Install

```
Expand Down Expand Up @@ -40,3 +42,19 @@ module.export = {
### Detailed explanation

Read [Critical CSS and Webpack: Automatically Minimize Render-Blocking CSS](https://vuejsdevelopers.com/2017/07/24/critical-css-webpack/) blogpost.

### Development
Since the main dependency of this project, critical, depends on an environment that supports Headless Chrome, [Docker](https://www.docker.com/) has been provided to support local development of this project.

After you have [installed Docker](https://www.docker.com/community-edition), you can do the following to get setup:
1. Start the container - `docker-compose up -d`
1. SSH into the container - `docker exec -it html-critical-webpack-plugin_nodejs_1 /bin/bash`
1. Install dependencies - `rm -rf node_modules && npm install` (this ensures Linux specific dependencies get installed)

Now you can run the project's `npm` scripts like usuual:
1. Run unit tests - `npm run test`
1. Run the build - `npm run ci`

**_Note_**: changes are bi-directional

Learn more about Docker [here](https://docs.docker.com/get-started/) or [configuring Headless Chrome for your own machine](https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md).
10 changes: 10 additions & 0 deletions docker-compose.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
version: '3.2'

services:

nodejs:
image: thegreenhouse/nodejs-dev
volumes:
- ./:/workspace
working_dir: /workspace
command: tail -f /dev/null
Loading

0 comments on commit 5a916be

Please sign in to comment.