-
Notifications
You must be signed in to change notification settings - Fork 10.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
add extract-text-webpack-plugin helper package
- Loading branch information
Showing
6 changed files
with
197 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
/*.js | ||
!src/index.js | ||
yarn.lock |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
# Logs | ||
logs | ||
*.log | ||
|
||
# Runtime data | ||
pids | ||
*.pid | ||
*.seed | ||
|
||
# Directory for instrumented libs generated by jscoverage/JSCover | ||
lib-cov | ||
|
||
# Coverage directory used by tools like istanbul | ||
coverage | ||
|
||
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) | ||
.grunt | ||
|
||
# node-waf configuration | ||
.lock-wscript | ||
|
||
# Compiled binary addons (http://nodejs.org/api/addons.html) | ||
build/Release | ||
|
||
# Dependency directory | ||
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git | ||
node_modules | ||
*.un~ | ||
yarn.lock | ||
src | ||
flow-typed | ||
coverage | ||
decls | ||
examples |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
# gatsby-1-config-extract-plugin | ||
|
||
extract-text-webpack-plugin instance getter for Gatsby v1 plugins. Allows all plugins to share the | ||
same instance. Should only be used by plugins that output styles for the main entry point and | ||
bundle (which is the vast majority of style plugins). | ||
|
||
## Install | ||
|
||
`npm install gatsby-1-config-extract-plugin --save-dev` | ||
|
||
## How to use | ||
|
||
This module exports two named functions, `extractTextPlugin` and `extractTextFilename`. Note that | ||
Gatsby's webpack config includes the extract plugin instances in the `plugins` array, so plugins | ||
that use this module don't need to - just use it's `extract` method in your loaders. | ||
|
||
**`extractTextPlugin(stage)`** | ||
|
||
Accepts the current stage name and returns the appropriate extract-text-webpack-plugin instance. | ||
Anywhere you would normally use `new ExtractTextPlugin()`, use this instead. | ||
|
||
**`extractTextFilename(stage)`** | ||
|
||
Accepts the current stage name and returns the name of the extracted text output file. Not required | ||
for most use cases. | ||
|
||
```javascript | ||
// in gatsby-node.js | ||
const { extractTextPlugin } = require(`gatsby-1-config-extract-plugin`) | ||
|
||
exports.modifyWebpackConfig = ({ config, stage }) => { | ||
switch(stage) { | ||
case `build-css`: { | ||
loader: extractTextPlugin(stage).extract(`style`, `css`) | ||
} | ||
} | ||
}; | ||
``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
{ | ||
"name": "gatsby-1-config-extract-plugin", | ||
"description": "extract-text-webpack-plugin instance getter for Gatsby v1 plugins", | ||
"version": "1.0.0", | ||
"author": "Shawn Erquhart<shawn@erquh.art>", | ||
"bugs": { | ||
"url": "https://github.com/gatsbyjs/gatsby/issues" | ||
}, | ||
"dependencies": { | ||
"babel-runtime": "^6.26.0", | ||
"extract-text-webpack-plugin": "^3.0.2" | ||
}, | ||
"devDependencies": { | ||
"babel-cli": "^6.26.0", | ||
"cross-env": "^5.0.5" | ||
}, | ||
"homepage": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-1-config-extract-plugin#readme", | ||
"keywords": [ | ||
"gatsby" | ||
], | ||
"license": "MIT", | ||
"main": "index.js", | ||
"repository": "https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-1-config-extract-plugin", | ||
"scripts": { | ||
"build": "babel src --out-dir . --ignore __tests__", | ||
"prepublish": "cross-env NODE_ENV=production npm run build", | ||
"watch": "babel -w src --out-dir . --ignore __tests__" | ||
} | ||
} |
34 changes: 34 additions & 0 deletions
34
packages/gatsby-1-config-extract-plugin/src/__tests__/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
const { extractTextPlugin, extractTextFilename } = require(`../index`) | ||
|
||
describe(`gatsby-1-config-extract-plugin`, () => { | ||
;[ | ||
{ | ||
stages: [`develop`, `non-existent-stage`], | ||
expectPlugin: false, | ||
}, | ||
{ | ||
stages: [`develop-html`, `build-css`, `build-html`, `build-javascript`], | ||
expectPlugin: true, | ||
}, | ||
].forEach(({ stages, expectPlugin }) => { | ||
stages.forEach(stage => { | ||
describe(`stage: ${stage}`, () => { | ||
if (expectPlugin) { | ||
it(`should return plugin`, () => { | ||
expect(typeof extractTextPlugin(stage)).toBe(`object`) | ||
}) | ||
it(`should return plugin with correct filename for current stage`, () => { | ||
expect(extractTextPlugin(stage)).toHaveProperty( | ||
`filename`, | ||
extractTextFilename(stage) | ||
) | ||
}) | ||
} else { | ||
it(`should throw`, () => { | ||
expect(() => extractTextPlugin(stage)).toThrow() | ||
}) | ||
} | ||
}) | ||
}) | ||
}) | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,59 @@ | ||
import ExtractTextPlugin from "extract-text-webpack-plugin" | ||
|
||
const extractDevelopHtml = new ExtractTextPlugin( | ||
extractTextFilename(`develop-html`) | ||
) | ||
const extractBuildHtml = new ExtractTextPlugin( | ||
extractTextFilename(`build-html`), | ||
{ | ||
allChunks: true, | ||
} | ||
) | ||
const extractBuildCss = new ExtractTextPlugin( | ||
extractTextFilename(`build-css`), | ||
{ allChunks: true } | ||
) | ||
const extractBuildJavascript = new ExtractTextPlugin( | ||
extractTextFilename(`build-javascript`), | ||
{ | ||
allChunks: true, | ||
} | ||
) | ||
|
||
const errorMsg = ` | ||
gatsby-1-config-extract-plugin: | ||
stage must be one of: "develop-html", "build-html", "build-css", "build-javascript". | ||
Note that the "develop" stage does not use extract-text-webpack-plugin. | ||
` | ||
|
||
function extractTextFilename(stage) { | ||
switch (stage) { | ||
case `develop-html`: | ||
case `build-html`: | ||
return `build-html-styles.css` | ||
case `build-css`: | ||
return `styles.css` | ||
case `build-javascript`: | ||
return `build-js-styles.css` | ||
default: | ||
throw Error(errorMsg) | ||
} | ||
} | ||
|
||
function extractTextPlugin(stage) { | ||
switch (stage) { | ||
case `develop-html`: | ||
return extractDevelopHtml | ||
case `build-html`: | ||
return extractBuildHtml | ||
case `build-css`: | ||
return extractBuildCss | ||
case `build-javascript`: | ||
return extractBuildJavascript | ||
default: | ||
throw Error(errorMsg) | ||
} | ||
} | ||
|
||
exports.extractTextPlugin = extractTextPlugin | ||
exports.extractTextFilename = extractTextFilename |