Repository: tivac/modular-css
Pull request #567 (2019-03-04 21:14:42)

Include Style String in Webpack Loader Output
<!--- Provide a general summary of your changes in the Title above -->

## Description
Added the ability to use the style string like so:

```
import { styles } from "./styles.css";
```

This feature is present in the rollup plugin (https://github.com/tivac/modular-css/blob/1a84b5d7ee5d0b95160059ebc3c6f604dc2524ec/packages/rollup/rollup.js#L134), but not in webpack.

## Motivation and Context
We want the ability to use the style string directly so we can insert it into the DOM wherever we want. We use ShadowDOM from time to time, so we want the ability to insert styles inside ShadowDOM.

## How Has This Been Tested?
<!--- Please describe in detail how you tested your changes. -->
<!--- Include details of your testing environment, and the tests you ran to -->
<!--- see how your change affects other areas of the code, etc. -->

## Types of changes
<!--- What types of changes does your code introduce? Put an `x` in all the boxes that apply: -->
- [ ] Bug fix (non-breaking change which fixes an issue)
- [x] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing functionality to change)

## Checklist:
<!--- Go over all the following points, and put an `x` in all the boxes that apply. -->
<!--- If you're unsure about any of these, don't hesitate to ask. We're here to help! -->
- [x] My code follows the code style of this project.
- [ ] My change requires a change to the documentation.
- [ ] I have updated the documentation accordingly.
- [x] I have read the **CONTRIBUTING** document.
- [x] I have added tests to cover my changes.
- [x] All new and existing tests passed.


codecov[bot]: # [Codecov](https://codecov.io/gh/tivac/modular-css/pull/567?src=pr&el=h1) Report
> Merging [#567](https://codecov.io/gh/tivac/modular-css/pull/567?src=pr&el=desc) into [master](https://codecov.io/gh/tivac/modular-css/commit/1a84b5d7ee5d0b95160059ebc3c6f604dc2524ec?src=pr&el=desc) will **increase** coverage by `<.01%`.
> The diff coverage is `100%`.

[![Impacted file tree graph](https://codecov.io/gh/tivac/modular-css/pull/567/graphs/tree.svg?width=650&token=EIUJKcuTE8&height=150&src=pr)](https://codecov.io/gh/tivac/modular-css/pull/567?src=pr&el=tree)

```diff
@@            Coverage Diff             @@
##           master     #567      +/-   ##
==========================================
+ Coverage   98.97%   98.98%   +<.01%     
==========================================
  Files          49       49              
  Lines        1176     1177       +1     
  Branches      183      183              
==========================================
+ Hits         1164     1165       +1     
  Misses         12       12
```


| [Impacted Files](https://codecov.io/gh/tivac/modular-css/pull/567?src=pr&el=tree) | Coverage Δ | |
|---|---|---|
| [packages/webpack/loader.js](https://codecov.io/gh/tivac/modular-css/pull/567/diff?src=pr&el=tree#diff-cGFja2FnZXMvd2VicGFjay9sb2FkZXIuanM=) | `92% <100%> (+0.33%)` | :arrow_up: |

------

[Continue to review full report at Codecov](https://codecov.io/gh/tivac/modular-css/pull/567?src=pr&el=continue).
> **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
> `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
> Powered by [Codecov](https://codecov.io/gh/tivac/modular-css/pull/567?src=pr&el=footer). Last update [1a84b5d...92982cf](https://codecov.io/gh/tivac/modular-css/pull/567?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).


Patch:
diff --git a/packages/webpack/loader.js b/packages/webpack/loader.js
index 4ffb8a7c..4b94a50b 100644
--- a/packages/webpack/loader.js
+++ b/packages/webpack/loader.js
@@ -37,19 +37,21 @@ module.exports = async function(source) {
         if(options.namedExports === false) {
             return done(null, out.join("\n"));
         }
-        
+
         // Warn if any of the exported CSS wasn't able to be used as a valid JS identifier
         // and exclude from the output
         Object.keys(exported).forEach((ident) => {
             if(keyword.isReservedWordES6(ident) || !keyword.isIdentifierNameES6(ident)) {
                 this.emitWarning(new Error(`Invalid JS identifier "${ident}", unable to export`));
-                
+
                 return;
             }
 
             out.push(`export var ${ident} = ${JSON.stringify(exported[ident])};`);
         });
 
+        out.push(`export var styles = ${JSON.stringify(result.details.result.css)};`);
+
         return done(null, out.join("\n"));
     } catch(e) {
         return done(e);


Test patch:
diff --git a/packages/webpack/test/__snapshots__/webpack.test.js.snap b/packages/webpack/test/__snapshots__/webpack.test.js.snap
index 21b9e1c6..27055f2e 100644
--- a/packages/webpack/test/__snapshots__/webpack.test.js.snap
+++ b/packages/webpack/test/__snapshots__/webpack.test.js.snap
@@ -93,11 +93,11 @@ exports[`/webpack.js should accept an existing processor instance 1`] = `
 /*!****************************************************!*\\\\
   !*** ./packages/webpack/test/specimens/simple.css ***!
   \\\\****************************************************/
-/*! exports provided: default, wooga */
+/*! exports provided: default, wooga, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"mc8d99986b_wooga\\\\\\"\\\\n});\\\\nvar wooga = \\\\\\"mc8d99986b_wooga\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/simple.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"mc8d99986b_wooga\\\\\\"\\\\n});\\\\nvar wooga = \\\\\\"mc8d99986b_wooga\\\\\\";\\\\nvar styles = \\\\\\".mc8d99986b_wooga { color: red; }\\\\\\\\n\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/simple.css?\\");
 
 /***/ }),
 
@@ -217,11 +217,11 @@ exports[`/webpack.js should generate correct builds in watch mode when files cha
 /*!**************************************************!*\\\\
   !*** ./packages/webpack/test/output/watched.css ***!
   \\\\**************************************************/
-/*! exports provided: default, one */
+/*! exports provided: default, one, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"one\\\\\\", function() { return one; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"one\\\\\\": \\\\\\"one\\\\\\"\\\\n});\\\\nvar one = \\\\\\"one\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/watched.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"one\\\\\\", function() { return one; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"one\\\\\\": \\\\\\"one\\\\\\"\\\\n});\\\\nvar one = \\\\\\"one\\\\\\";\\\\nvar styles = \\\\\\".one { color: red; }\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/watched.css?\\");
 
 /***/ }),
 
@@ -338,11 +338,11 @@ exports[`/webpack.js should generate correct builds in watch mode when files cha
 /*!**************************************************!*\\\\
   !*** ./packages/webpack/test/output/watched.css ***!
   \\\\**************************************************/
-/*! exports provided: default, two */
+/*! exports provided: default, two, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"two\\\\\\", function() { return two; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"two\\\\\\": \\\\\\"two\\\\\\"\\\\n});\\\\nvar two = \\\\\\"two\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/watched.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"two\\\\\\", function() { return two; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"two\\\\\\": \\\\\\"two\\\\\\"\\\\n});\\\\nvar two = \\\\\\"two\\\\\\";\\\\nvar styles = \\\\\\".two { color: blue; }\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/watched.css?\\");
 
 /***/ }),
 
@@ -459,11 +459,11 @@ exports[`/webpack.js should generate correct builds when files change 1`] = `
 /*!**************************************************!*\\\\
   !*** ./packages/webpack/test/output/changed.css ***!
   \\\\**************************************************/
-/*! exports provided: default, one */
+/*! exports provided: default, one, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"one\\\\\\", function() { return one; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"one\\\\\\": \\\\\\"one\\\\\\"\\\\n});\\\\nvar one = \\\\\\"one\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/changed.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"one\\\\\\", function() { return one; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"one\\\\\\": \\\\\\"one\\\\\\"\\\\n});\\\\nvar one = \\\\\\"one\\\\\\";\\\\nvar styles = \\\\\\".one { color: red; }\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/changed.css?\\");
 
 /***/ }),
 
@@ -580,11 +580,11 @@ exports[`/webpack.js should generate correct builds when files change 3`] = `
 /*!**************************************************!*\\\\
   !*** ./packages/webpack/test/output/changed.css ***!
   \\\\**************************************************/
-/*! exports provided: default, two */
+/*! exports provided: default, two, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"two\\\\\\", function() { return two; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"two\\\\\\": \\\\\\"two\\\\\\"\\\\n});\\\\nvar two = \\\\\\"two\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/changed.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"two\\\\\\", function() { return two; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"two\\\\\\": \\\\\\"two\\\\\\"\\\\n});\\\\nvar two = \\\\\\"two\\\\\\";\\\\nvar styles = \\\\\\".two { color: blue; }\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/changed.css?\\");
 
 /***/ }),
 
@@ -701,11 +701,11 @@ exports[`/webpack.js should generate correct builds when files change 5`] = `
 /*!**************************************************!*\\\\
   !*** ./packages/webpack/test/output/changed.css ***!
   \\\\**************************************************/
-/*! exports provided: default, three */
+/*! exports provided: default, three, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"three\\\\\\", function() { return three; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"three\\\\\\": \\\\\\"three\\\\\\"\\\\n});\\\\nvar three = \\\\\\"three\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/changed.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"three\\\\\\", function() { return three; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"three\\\\\\": \\\\\\"three\\\\\\"\\\\n});\\\\nvar three = \\\\\\"three\\\\\\";\\\\nvar styles = \\\\\\".three { color: green; }\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/output/changed.css?\\");
 
 /***/ }),
 
@@ -822,11 +822,11 @@ exports[`/webpack.js should handle dependencies 1`] = `
 /*!***************************************************!*\\\\
   !*** ./packages/webpack/test/specimens/start.css ***!
   \\\\***************************************************/
-/*! exports provided: default, one, two, folder, wooga, booga, tooga */
+/*! exports provided: default, one, two, folder, wooga, booga, tooga, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"one\\\\\\", function() { return one; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"two\\\\\\", function() { return two; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"folder\\\\\\", function() { return folder; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"booga\\\\\\", function() { return booga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"tooga\\\\\\", function() { return tooga; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"one\\\\\\": \\\\\\"red\\\\\\",\\\\n    \\\\\\"two\\\\\\": \\\\\\"blue\\\\\\",\\\\n    \\\\\\"folder\\\\\\": \\\\\\"white\\\\\\",\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"booga wooga\\\\\\",\\\\n    \\\\\\"booga\\\\\\": \\\\\\"booga\\\\\\",\\\\n    \\\\\\"tooga\\\\\\": \\\\\\"tooga\\\\\\"\\\\n});\\\\nvar one = \\\\\\"red\\\\\\";\\\\nvar two = \\\\\\"blue\\\\\\";\\\\nvar folder = \\\\\\"white\\\\\\";\\\\nvar wooga = \\\\\\"booga wooga\\\\\\";\\\\nvar booga = \\\\\\"booga\\\\\\";\\\\nvar tooga = \\\\\\"tooga\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/start.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"one\\\\\\", function() { return one; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"two\\\\\\", function() { return two; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"folder\\\\\\", function() { return folder; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"booga\\\\\\", function() { return booga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"tooga\\\\\\", function() { return tooga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"one\\\\\\": \\\\\\"red\\\\\\",\\\\n    \\\\\\"two\\\\\\": \\\\\\"blue\\\\\\",\\\\n    \\\\\\"folder\\\\\\": \\\\\\"white\\\\\\",\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"booga wooga\\\\\\",\\\\n    \\\\\\"booga\\\\\\": \\\\\\"booga\\\\\\",\\\\n    \\\\\\"tooga\\\\\\": \\\\\\"tooga\\\\\\"\\\\n});\\\\nvar one = \\\\\\"red\\\\\\";\\\\nvar two = \\\\\\"blue\\\\\\";\\\\nvar folder = \\\\\\"white\\\\\\";\\\\nvar wooga = \\\\\\"booga wooga\\\\\\";\\\\nvar booga = \\\\\\"booga\\\\\\";\\\\nvar tooga = \\\\\\"tooga\\\\\\";\\\\nvar styles = \\\\\\".booga { color: red; background: blue; }\\\\\\\\n.tooga { border: 1px solid white; }\\\\\\\\n\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/start.css?\\");
 
 /***/ }),
 
@@ -971,11 +971,11 @@ exports[`/webpack.js should output css to disk 1`] = `
 /*!****************************************************!*\\\\
   !*** ./packages/webpack/test/specimens/simple.css ***!
   \\\\****************************************************/
-/*! exports provided: default, wooga */
+/*! exports provided: default, wooga, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"wooga\\\\\\"\\\\n});\\\\nvar wooga = \\\\\\"wooga\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/simple.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"wooga\\\\\\"\\\\n});\\\\nvar wooga = \\\\\\"wooga\\\\\\";\\\\nvar styles = \\\\\\".wooga { color: red; }\\\\\\\\n\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/simple.css?\\");
 
 /***/ }),
 
@@ -1101,11 +1101,11 @@ exports[`/webpack.js should output json to disk 1`] = `
 /*!****************************************************!*\\\\
   !*** ./packages/webpack/test/specimens/simple.css ***!
   \\\\****************************************************/
-/*! exports provided: default, wooga */
+/*! exports provided: default, wooga, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"wooga\\\\\\"\\\\n});\\\\nvar wooga = \\\\\\"wooga\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/simple.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"wooga\\\\\\", function() { return wooga; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"wooga\\\\\\": \\\\\\"wooga\\\\\\"\\\\n});\\\\nvar wooga = \\\\\\"wooga\\\\\\";\\\\nvar styles = \\\\\\".wooga { color: red; }\\\\\\\\n\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/simple.css?\\");
 
 /***/ }),
 
@@ -1236,11 +1236,11 @@ eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony import */ var
 /*!****************************************************!*\\\\
   !*** ./packages/webpack/test/specimens/es2015.css ***!
   \\\\****************************************************/
-/*! exports provided: default, val, a, b */
+/*! exports provided: default, val, a, b, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"val\\\\\\", function() { return val; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"a\\\\\\", function() { return a; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"b\\\\\\", function() { return b; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"val\\\\\\": \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\",\\\\n    \\\\\\"a\\\\\\": \\\\\\"a\\\\\\",\\\\n    \\\\\\"b\\\\\\": \\\\\\"b\\\\\\"\\\\n});\\\\nvar val = \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\";\\\\nvar a = \\\\\\"a\\\\\\";\\\\nvar b = \\\\\\"b\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/es2015.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"val\\\\\\", function() { return val; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"a\\\\\\", function() { return a; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"b\\\\\\", function() { return b; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"val\\\\\\": \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\",\\\\n    \\\\\\"a\\\\\\": \\\\\\"a\\\\\\",\\\\n    \\\\\\"b\\\\\\": \\\\\\"b\\\\\\"\\\\n});\\\\nvar val = \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\";\\\\nvar a = \\\\\\"a\\\\\\";\\\\nvar b = \\\\\\"b\\\\\\";\\\\nvar styles = \\\\\\".a { color: red; }\\\\\\\\n.b { color: blue; }\\\\\\\\n\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/es2015.css?\\");
 
 /***/ })
 
@@ -1359,11 +1359,11 @@ eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony import */ var
 /*!****************************************************!*\\\\
   !*** ./packages/webpack/test/specimens/es2015.css ***!
   \\\\****************************************************/
-/*! exports provided: default, val, a, b */
+/*! exports provided: default, val, a, b, styles */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 \\"use strict\\";
-eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"val\\\\\\", function() { return val; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"a\\\\\\", function() { return a; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"b\\\\\\", function() { return b; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"val\\\\\\": \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\",\\\\n    \\\\\\"a\\\\\\": \\\\\\"a\\\\\\",\\\\n    \\\\\\"b\\\\\\": \\\\\\"b\\\\\\"\\\\n});\\\\nvar val = \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\";\\\\nvar a = \\\\\\"a\\\\\\";\\\\nvar b = \\\\\\"b\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/es2015.css?\\");
+eval(\\"__webpack_require__.r(__webpack_exports__);\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"val\\\\\\", function() { return val; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"a\\\\\\", function() { return a; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"b\\\\\\", function() { return b; });\\\\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \\\\\\"styles\\\\\\", function() { return styles; });\\\\n/* harmony default export */ __webpack_exports__[\\\\\\"default\\\\\\"] = ({\\\\n    \\\\\\"val\\\\\\": \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\",\\\\n    \\\\\\"a\\\\\\": \\\\\\"a\\\\\\",\\\\n    \\\\\\"b\\\\\\": \\\\\\"b\\\\\\"\\\\n});\\\\nvar val = \\\\\\"\\\\\\\\\\\\\\"value\\\\\\\\\\\\\\"\\\\\\";\\\\nvar a = \\\\\\"a\\\\\\";\\\\nvar b = \\\\\\"b\\\\\\";\\\\nvar styles = \\\\\\".a { color: red; }\\\\\\\\n.b { color: blue; }\\\\\\\\n\\\\\\";\\\\n\\\\n//# sourceURL=webpack:///./packages/webpack/test/specimens/es2015.css?\\");
 
 /***/ })