Files

Return to Package Diff Home.
Brought to you by Intrinsic.

Package Diff: mini-css-extract-plugin @ 0.6.0 .. 0.7.0

CHANGELOG.md

@@ -1,7 +1,26 @@
-# Change Log
+# Changelog
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
+## [0.7.0](https://github.com/webpack-contrib/mini-css-extract-plugin/compare/v0.6.0...v0.7.0) (2019-05-27)
+
+
+### Bug Fixes
+
+* do not attempt to reload unrequestable urls ([#378](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/378)) ([44d00ea](https://github.com/webpack-contrib/mini-css-extract-plugin/commit/44d00ea))
+* fix `publicPath` regression ([#384](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/384)) ([582ebfe](https://github.com/webpack-contrib/mini-css-extract-plugin/commit/582ebfe))
+* enable using plugin without defining options ([#393](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/393)) ([a7dee8c](https://github.com/webpack-contrib/mini-css-extract-plugin/commit/a7dee8c))
+* downgrading normalize-url ([#399](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/399)) ([0dafaf6](https://github.com/webpack-contrib/mini-css-extract-plugin/commit/0dafaf6))
+* hmr do not crash on link without href ([#400](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/400)) ([aa9b541](https://github.com/webpack-contrib/mini-css-extract-plugin/commit/aa9b541))
+* hmr reload with invalid link url ([#402](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/402)) ([30a19b0](https://github.com/webpack-contrib/mini-css-extract-plugin/commit/30a19b0))
+
+
+### Features
+
+* add `moduleFilename` option ([#381](https://github.com/webpack-contrib/mini-css-extract-plugin/issues/381)) ([13e9cbf](https://github.com/webpack-contrib/mini-css-extract-plugin/commit/13e9cbf))
+
+
+
<a name="0.6.0"></a>
# [0.6.0](https://github.com/webpack-contrib/mini-css-extract-plugin/compare/v0.5.0...v0.6.0) (2019-04-10)

dist/hmr/hotModuleReplacement.js

@@ -1,19 +1,11 @@
"use strict";
-/* global document, window */
+/* eslint-env browser */
/*
eslint-disable
- func-names,
- no-var,
- vars-on-top,
- prefer-arrow-func,
- prefer-rest-params,
- prefer-arrow-callback,
- prefer-template,
- prefer-destructuring,
- no-param-reassign,
- no-console
+ no-console,
+ func-names
*/
var normalizeUrl = require('normalize-url');
@@ -22,11 +14,11 @@
var forEach = Array.prototype.forEach;
function debounce(fn, time) {
- var timeout = 0; // eslint-disable-next-line func-names
-
+ var timeout = 0;
return function () {
- var self = this;
- var args = arguments; // eslint-disable-next-line prefer-rest-params
+ var self = this; // eslint-disable-next-line prefer-rest-params
+
+ var args = arguments;
var functionCall = function functionCall() {
return fn.apply(self, args);
@@ -74,8 +66,8 @@
}
return fileMap.split(',').map(function (mapRule) {
- var reg = new RegExp(filename + '\\.js$', 'g');
- return normalizeUrl(src.replace(reg, mapRule.replace(/{fileName}/g, filename) + '.css'), {
+ var reg = new RegExp("".concat(filename, "\\.js$"), 'g');
+ return normalizeUrl(src.replace(reg, "".concat(mapRule.replace(/{fileName}/g, filename), ".css")), {
stripWWW: false
});
});
@@ -84,9 +76,18 @@
function updateCss(el, url) {
if (!url) {
+ if (!el.href) {
+ return;
+ } // eslint-disable-next-line
+
+
url = el.href.split('?')[0];
}
+ if (!isUrlRequest(url)) {
+ return;
+ }
+
if (el.isLoaded === false) {
// We seem to be about to replace a css link that hasn't loaded yet.
// We're probably changing the same file more than once.
@@ -95,11 +96,11 @@
if (!url || !(url.indexOf('.css') > -1)) {
return;
- }
+ } // eslint-disable-next-line no-param-reassign
- el.visited = true;
- var newEl = el.cloneNode(); // eslint-disable-line vars-on-top
+ el.visited = true;
+ var newEl = el.cloneNode();
newEl.isLoaded = false;
newEl.addEventListener('load', function () {
newEl.isLoaded = true;
@@ -109,12 +110,18 @@
newEl.isLoaded = true;
el.parentNode.removeChild(el);
});
- newEl.href = url + '?' + Date.now();
+ newEl.href = "".concat(url, "?").concat(Date.now());
+
+ if (el.nextSibling) {
+ el.parentNode.insertBefore(newEl, el.nextSibling);
+ } else {
el.parentNode.appendChild(newEl);
+ }
}
function getReloadUrl(href, src) {
- var ret;
+ var ret; // eslint-disable-next-line no-param-reassign
+
href = normalizeUrl(href, {
stripWWW: false
}); // eslint-disable-next-line array-callback-return
@@ -131,8 +138,16 @@
var elements = document.querySelectorAll('link');
var loaded = false;
forEach.call(elements, function (el) {
+ if (!el.href) {
+ return;
+ }
+
var url = getReloadUrl(el.href, src);
+ if (!isUrlRequest(url)) {
+ return;
+ }
+
if (el.visited === true) {
return;
}
@@ -156,12 +171,21 @@
});
}
+function isUrlRequest(url) {
+ // An URL is not an request if
+ // It is not http or https
+ if (!/^https?:/i.test(url)) {
+ return false;
+ }
+
+ return true;
+}
+
module.exports = function (moduleId, options) {
if (noDocument) {
console.log('no window.document found, will not HMR CSS');
return noop;
- } // eslint-disable-next-line vars-on-top
-
+ }
var getScriptSrc = getCurrentScriptUrl(moduleId);

dist/index.js

@@ -28,6 +28,8 @@
const REGEXP_CHUNKHASH = /\[chunkhash(?::(\d+))?\]/i;
const REGEXP_CONTENTHASH = /\[contenthash(?::(\d+))?\]/i;
const REGEXP_NAME = /\[name\]/i;
+const REGEXP_PLACEHOLDERS = /\[(name|id|chunkhash)\]/g;
+const DEFAULT_FILENAME = '[name].css';
class CssDependency extends _webpack.default.Dependency {
constructor({
@@ -127,20 +129,18 @@
}
class MiniCssExtractPlugin {
- constructor(options) {
+ constructor(options = {}) {
this.options = Object.assign({
- filename: '[name].css'
+ filename: DEFAULT_FILENAME,
+ moduleFilename: () => options.filename || DEFAULT_FILENAME
}, options);
if (!this.options.chunkFilename) {
const {
filename
- } = this.options;
- const hasName = filename.includes('[name]');
- const hasId = filename.includes('[id]');
- const hasChunkHash = filename.includes('[chunkhash]'); // Anything changing depending on chunk is fine
+ } = this.options; // Anything changing depending on chunk is fine
- if (hasChunkHash || hasName || hasId) {
+ if (filename.match(REGEXP_PLACEHOLDERS)) {
this.options.chunkFilename = filename;
} else {
// Elsewise prefix '[id].' in front of the basename to make it changing
@@ -179,7 +179,9 @@
if (renderedModules.length > 0) {
result.push({
render: () => this.renderContentAsset(compilation, chunk, renderedModules, compilation.runtimeTemplate.requestShortener),
- filenameTemplate: this.options.filename,
+ filenameTemplate: ({
+ chunk: chunkData
+ }) => this.options.moduleFilename(chunkData),
pathOptions: {
chunk,
contentHashType: MODULE_TYPE

dist/loader.js

@@ -78,7 +78,7 @@
this.addDependency(this.resourcePath);
const childFilename = '*'; // eslint-disable-line no-path-concat
- const publicPath = typeof options.publicPath === 'string' ? options.publicPath.endsWith('/') ? options.publicPath : `${options.publicPath}/` : typeof options.publicPath === 'function' ? options.publicPath(this.resourcePath, this.rootContext) : this._compilation.outputOptions.publicPath;
+ const publicPath = typeof options.publicPath === 'string' ? options.publicPath === '' || options.publicPath.endsWith('/') ? options.publicPath : `${options.publicPath}/` : typeof options.publicPath === 'function' ? options.publicPath(this.resourcePath, this.rootContext) : this._compilation.outputOptions.publicPath;
const outputOptions = {
filename: childFilename,
publicPath

package.json

@@ -1,6 +1,6 @@
{
"name": "mini-css-extract-plugin",
- "version": "0.6.0",
+ "version": "0.7.0",
"description": "extracts CSS into separate files",
"license": "MIT",
"repository": "webpack-contrib/mini-css-extract-plugin",
@@ -19,18 +19,15 @@
"clean": "del-cli dist",
"commitlint": "commitlint --from=master",
"lint": "eslint --cache src test",
- "prepublish": "npm run build",
+ "prepare": "npm run build",
"release": "standard-version",
"security": "npm audit",
"test:only": "jest",
"test:watch": "jest --watch",
"test:coverage": "jest --collectCoverageFrom='src/**/*.js' --coverage",
+ "test:manual": "webpack-dev-server test/manual/src/index.js --open --config test/manual/webpack.config.js",
"pretest": "npm run lint",
- "test": "npm run test:only",
- "ci:lint": "npm run lint && npm run security",
- "ci:test": "npm run test:only -- --runInBand",
- "ci:coverage": "npm run test:coverage -- --runInBand",
- "ci:lint:commits": "commitlint --from=origin/master --to=${CIRCLE_SHA1}",
+ "test": "npm run test:coverage",
"defaults": "webpack-defaults"
},
"files": [
@@ -41,39 +38,40 @@
},
"dependencies": {
"loader-utils": "^1.1.0",
- "normalize-url": "^2.0.1",
+ "normalize-url": "1.9.1",
"schema-utils": "^1.0.0",
"webpack-sources": "^1.1.0"
},
"devDependencies": {
- "@babel/cli": "^7.4.3",
- "@babel/core": "^7.4.3",
- "@babel/preset-env": "^7.4.3",
- "@commitlint/cli": "^7.5.2",
- "@commitlint/config-conventional": "^7.5.0",
- "@webpack-contrib/defaults": "^3.1.1",
+ "@babel/cli": "^7.4.4",
+ "@babel/core": "^7.4.4",
+ "@babel/preset-env": "^7.4.4",
+ "@commitlint/cli": "^7.6.1",
+ "@commitlint/config-conventional": "^7.6.0",
+ "@webpack-contrib/defaults": "^4.0.1",
"@webpack-contrib/eslint-config-webpack": "^3.0.0",
"acorn": "^6.1.1",
"babel-eslint": "^10.0.1",
- "babel-jest": "^24.7.1",
- "cross-env": "^5.1.3",
+ "babel-jest": "^24.8.0",
+ "commitlint-azure-pipelines-cli": "^1.0.1",
+ "cross-env": "^5.2.0",
"css-loader": "^2.1.1",
- "del": "^4.1.0",
+ "del": "^4.1.1",
"del-cli": "^1.1.0",
"es-check": "^5.0.0",
"eslint": "^5.16.0",
- "eslint-plugin-import": "^2.16.0",
- "eslint-plugin-prettier": "^3.0.1",
+ "eslint-plugin-import": "^2.17.2",
+ "eslint-plugin-prettier": "^3.1.0",
"file-loader": "^3.0.1",
- "husky": "^1.3.1",
- "jest": "^24.7.1",
- "lint-staged": "^8.1.5",
+ "husky": "^2.2.0",
+ "jest": "^24.8.0",
+ "jest-junit": "^6.4.0",
+ "lint-staged": "^8.1.6",
"memory-fs": "^0.4.1",
- "pre-commit": "^1.2.2",
- "prettier": "^1.16.4",
- "standard-version": "^5.0.2",
- "webpack": "4.29.0",
- "webpack-cli": "^3.3.0",
+ "prettier": "^1.17.0",
+ "standard-version": "^6.0.1",
+ "webpack": "^4.31.0",
+ "webpack-cli": "^3.3.2",
"webpack-dev-server": "^3.3.1"
},
"keywords": [
@@ -81,39 +79,5 @@
"css",
"extract",
"hmr"
- ],
- "babel": {
- "presets": [
- [
- "@babel/preset-env",
- {
- "targets": {
- "node": "6.9.0"
- }
- }
- ]
- ]
- },
- "husky": {
- "hooks": {
- "pre-commit": "lint-staged",
- "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
- }
- },
- "lint-staged": {
- "*.js": [
- "eslint --fix",
- "git add"
- ]
- },
- "commitlint": {
- "extends": [
- "@commitlint/config-conventional"
]
- },
- "prettier": {
- "singleQuote": true,
- "trailingComma": "es5",
- "arrowParens": "always"
- }
}

README.md

@@ -342,6 +342,16 @@
};
```
+#### Module Filename Option
+
+With the `moduleFilename` option you can use chunk data to customize the filename. This is particularly useful when dealing with multiple entry points and wanting to get more control out of the filename for a given entry point/chunk. In the example below, we'll use `moduleFilename` to output the generated css into a different directory.
+
+```javascript
+const miniCssExtractPlugin = new MiniCssExtractPlugin({
+ moduleFilename: ({ name }) => `${name.replace('/js/', '/css/')}.css`
+})
+```
+
#### Long Term Caching
For long term caching use `filename: "[contenthash].css"`. Optionally add `[name]`.
@@ -367,9 +377,11 @@
[node-url]: https://nodejs.org
[deps]: https://david-dm.org/webpack-contrib/mini-css-extract-plugin.svg
[deps-url]: https://david-dm.org/webpack-contrib/mini-css-extract-plugin
-[tests]: https://img.shields.io/circleci/project/github/webpack-contrib/mini-css-extract-plugin.svg
-[tests-url]: https://circleci.com/gh/webpack-contrib/mini-css-extract-plugin
+[tests]: https://dev.azure.com/webpack-contrib/mini-css-extract-plugin/_apis/build/status/webpack-contrib.mini-css-extract-plugin?branchName=master
+[tests-url]: https://dev.azure.com/webpack-contrib/mini-css-extract-plugin/_build/latest?definitionId=6&branchName=master
[cover]: https://codecov.io/gh/webpack-contrib/mini-css-extract-plugin/branch/master/graph/badge.svg
[cover-url]: https://codecov.io/gh/webpack-contrib/mini-css-extract-plugin
[chat]: https://img.shields.io/badge/gitter-webpack%2Fwebpack-brightgreen.svg
[chat-url]: https://gitter.im/webpack/webpack
+[size]: https://packagephobia.now.sh/badge?p=mini-css-extract-plugin
+[size-url]: https://packagephobia.now.sh/result?p=mini-css-extract-plugin