[TASK] Rewrite replacement management

This commit is contained in:
Philipp Dieter 2019-08-31 14:56:33 +02:00
parent f796aae834
commit 4467a6aa17
3 changed files with 57 additions and 303 deletions

123
index.js
View File

@ -1,7 +1,7 @@
const cheerio = require('cheerio')
var mkdirp = require('mkdirp');
var fs = require('fs'); var fs = require('fs');
var mkdirp = require('mkdirp');
var path = require('path'); var path = require('path');
var RawSource = require("webpack-sources/lib/RawSource");
function HtmlWebpackAlterDataPlugin (options) { function HtmlWebpackAlterDataPlugin (options) {
this.options = { this.options = {
@ -14,99 +14,54 @@ function HtmlWebpackAlterDataPlugin (options) {
} }
HtmlWebpackAlterDataPlugin.prototype.apply = function (compiler) { HtmlWebpackAlterDataPlugin.prototype.apply = function (compiler) {
var self = this var self = this;
function processHtml(co, compilation) { compiler.hooks.emit.tapAsync('HtmlWebpackAlterDataPlugin', (compilation, callback) => {
var filenameHashed = null;
self.options.chunkFilenameReplacement.forEach(function(replacement) { self.options.chunkFilenameReplacement.forEach(function(replacement) {
co(replacement.tag).each(function(i, elem) {
var tag = co(elem)[0]
if ( (!tag)
|| (!('attribs' in tag))
|| (!(replacement.attribute in tag.attribs))
) {
return
}
var url = tag.attribs[replacement.attribute]
if (url[0] != '~') {
return
}
url = url.substring(1)
var hash = url.slice(url.indexOf('#'))
var path = url.slice(0, url.indexOf('#'))
var file = path.slice(url.lastIndexOf('/') + 1)
var path = path.slice(0, url.lastIndexOf('/') + 1)
var filename = file.slice(0, file.indexOf('.'))
var extension = file.slice(file.indexOf('.') + 1)
compilation.chunks.forEach(function(chunk) { compilation.chunks.forEach(function(chunk) {
if (chunk.name != filename) { if (chunk.name != 'spritemap') {
return return
} }
chunk.files.forEach(function(file) { filenameHashed = '/assets/spritemap.' + chunk.renderedHash + '.svg';
if (!file.startsWith(path)) { });
return });
if (filenameHashed) {
for (var basename in compilation.assets) {
var result = compilation.assets[basename].source();
var regexp = /<use xlink:href="~assets\/spritemap\.svg#([a-zA-Z-]*)">/g;
var replacement = '<use xlink:href="' + filenameHashed + '#$1">';
var result = result.replace(regexp, replacement);
var regexp = /<use xlink:href=\\"~assets\/spritemap\.svg#([a-zA-Z-]*)\\">/g;
var replacement = '<use xlink:href=\\"' + filenameHashed + '#$1\\">';
var result = result.replace(regexp, replacement);
compilation.assets[basename] = new RawSource(result);
} }
if (!file.endsWith('.' + extension)) {
return
}
tag.attribs[replacement.attribute] = '/' + file + hash
})
})
})
})
return co
} }
callback();
});
compiler.hooks.compilation.tap('HtmlWebpackAlterDataPlugin', (compilation) => { compiler.hooks.compilation.tap('HtmlWebpackAlterDataPlugin', (compilation) => {
compilation.hooks.htmlWebpackPluginAfterHtmlProcessing.tapAsync('HtmlWebpackAlterDataPlugin', (data, cb) => { compilation.hooks.htmlWebpackPluginAfterHtmlProcessing.tapAsync('HtmlWebpackAlterDataPlugin', (data, cb) => {
data.html = data.html.replace('<!DOCTYPE html5>', '<!DOCTYPE html>');
if ('chunkFilenameReplacement' in this.options) { data.html = data.html.replace(/<!--\|\%\|/g, '');
var co = cheerio.load(data.html, { data.html = data.html.replace(/\|\%\|-->/g, '');
recognizeSelfClosing: false,
lowerCaseTags: false,
lowerCaseAttributeNames: false,
decodeEntities: false,
})
co = processHtml(co, compilation)
co('script').each(function(i, elem) {
if (co(elem).attr('type') != 'text/x-template') {
return;
}
var script = cheerio.load(co(elem).html(), {
recognizeSelfClosing: false,
lowerCaseTags: false,
lowerCaseAttributeNames: false,
decodeEntities: false,
})
var scriptResult = processHtml(script, compilation).html()
co(co('script').get(i)).html(scriptResult)
})
data.html = co.html()
}
data.html = data.html.replace('<!DOCTYPE html5>', '<!DOCTYPE html>')
data.html = data.html.replace(/<!--\|\%\|/g, '')
data.html = data.html.replace(/\|\%\|-->/g, '')
cb(null, data) cb(null, data)
}) });
});
})
compiler.hooks.emit.tap('HtmlWebpackAlterDataPlugin', (compilation) => { compiler.hooks.emit.tap('HtmlWebpackAlterDataPlugin', (compilation) => {
if (!this.options.assetsConstants) { if (!this.options.assetsConstants) {
return return;
} }
fileContent = '' fileContent = ''
compilation.chunks.forEach(function(chunk) { compilation.chunks.forEach(function(chunk) {
chunk.files.forEach(function(file) { chunk.files.forEach(function(file) {
var extension = file.slice(file.lastIndexOf('.') + 1) var extension = file.slice(file.lastIndexOf('.') + 1);
line = 'asset.' + extension + '.' + chunk.name + ' = ' + '/' + file + '\n' line = 'asset.' + extension + '.' + chunk.name + ' = ' + '/' + file + '\n';
fileContent += line fileContent += line;
}) });
}) });
compilation.assets[this.options.assetsConstants] = { compilation.assets[this.options.assetsConstants] = {
source: function() { source: function() {
return fileContent; return fileContent;
@ -115,25 +70,13 @@ HtmlWebpackAlterDataPlugin.prototype.apply = function (compiler) {
return fileContent.length; return fileContent.length;
} }
}; };
var fullPath = path.resolve(this.outputPath || compilation.compiler.outputPath, this.options.assetsConstants); var fullPath = path.resolve(this.outputPath || compilation.compiler.outputPath, this.options.assetsConstants);
var directory = path.dirname(fullPath); var directory = path.dirname(fullPath);
mkdirp(directory, function (err) { mkdirp(directory, function (err) {
if (err) { fs.writeFile(fullPath, fileContent, function (err) {});
//return callback(err);
}
// Write to disk
fs.writeFile(fullPath, fileContent, function (err) {
if (err) {
//return callback(err);
}
//callback(null);
}); });
}); });
})
}; };
module.exports = HtmlWebpackAlterDataPlugin module.exports = HtmlWebpackAlterDataPlugin

221
package-lock.json generated
View File

@ -4,178 +4,6 @@
"lockfileVersion": 1, "lockfileVersion": 1,
"requires": true, "requires": true,
"dependencies": { "dependencies": {
"boolbase": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
"integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
},
"cheerio": {
"version": "0.22.0",
"resolved": "http://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
"integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4=",
"requires": {
"css-select": "~1.2.0",
"dom-serializer": "~0.1.0",
"entities": "~1.1.1",
"htmlparser2": "^3.9.1",
"lodash.assignin": "^4.0.9",
"lodash.bind": "^4.1.4",
"lodash.defaults": "^4.0.1",
"lodash.filter": "^4.4.0",
"lodash.flatten": "^4.2.0",
"lodash.foreach": "^4.3.0",
"lodash.map": "^4.4.0",
"lodash.merge": "^4.4.0",
"lodash.pick": "^4.2.1",
"lodash.reduce": "^4.4.0",
"lodash.reject": "^4.4.0",
"lodash.some": "^4.4.0"
}
},
"css-select": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
"integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
"requires": {
"boolbase": "~1.0.0",
"css-what": "2.1",
"domutils": "1.5.1",
"nth-check": "~1.0.1"
}
},
"css-what": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.2.tgz",
"integrity": "sha512-wan8dMWQ0GUeF7DGEPVjhHemVW/vy6xUYmFzRY8RYqgA0JtXC9rJmbScBjqSu6dg9q0lwPQy6ZAmJVr3PPTvqQ=="
},
"dom-serializer": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
"integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
"requires": {
"domelementtype": "~1.1.1",
"entities": "~1.1.1"
},
"dependencies": {
"domelementtype": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
"integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
}
}
},
"domelementtype": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.2.1.tgz",
"integrity": "sha512-SQVCLFS2E7G5CRCMdn6K9bIhRj1bS6QBWZfF0TUPh4V/BbqrQ619IdSS3/izn0FZ+9l+uODzaZjb08fjOfablA=="
},
"domhandler": {
"version": "2.4.2",
"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
"integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
"requires": {
"domelementtype": "1"
}
},
"domutils": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
"integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=",
"requires": {
"dom-serializer": "0",
"domelementtype": "1"
}
},
"entities": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
"integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
},
"htmlparser2": {
"version": "3.10.0",
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.0.tgz",
"integrity": "sha512-J1nEUGv+MkXS0weHNWVKJJ+UrLfePxRWpN3C9bEi9fLxL2+ggW94DQvgYVXsaT30PGwYRIZKNZXuyMhp3Di4bQ==",
"requires": {
"domelementtype": "^1.3.0",
"domhandler": "^2.3.0",
"domutils": "^1.5.1",
"entities": "^1.1.1",
"inherits": "^2.0.1",
"readable-stream": "^3.0.6"
},
"dependencies": {
"domelementtype": {
"version": "1.3.0",
"resolved": "http://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
"integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI="
}
}
},
"inherits": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
"integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
},
"lodash.assignin": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz",
"integrity": "sha1-uo31+4QesKPoBEIysOJjqNxqKKI="
},
"lodash.bind": {
"version": "4.2.1",
"resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz",
"integrity": "sha1-euMBfpOWIqwxt9fX3LGzTbFpDTU="
},
"lodash.defaults": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
"integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
},
"lodash.filter": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz",
"integrity": "sha1-ZosdSYFgOuHMWm+nYBQ+SAtMSs4="
},
"lodash.flatten": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
"integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
},
"lodash.foreach": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz",
"integrity": "sha1-Gmo16s5AEoDH8G3d7DUWWrJ+PlM="
},
"lodash.map": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
"integrity": "sha1-dx7Hg540c9nEzeKLGTlMNWL09tM="
},
"lodash.merge": {
"version": "4.6.1",
"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.1.tgz",
"integrity": "sha512-AOYza4+Hf5z1/0Hztxpm2/xiPZgi/cjMqdnKTUWTBSKchJlxXXuUSxCCl8rJlf4g6yww/j6mA8nC8Hw/EZWxKQ=="
},
"lodash.pick": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
"integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM="
},
"lodash.reduce": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz",
"integrity": "sha1-8atrg5KZrUj3hKu/R2WW8DuRTTs="
},
"lodash.reject": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
"integrity": "sha1-gNZJLcFHCGS79YNTO2UfQqn1JBU="
},
"lodash.some": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz",
"integrity": "sha1-G7nzFO9ri63tE7VJFpsqlF62jk0="
},
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
@ -189,41 +17,24 @@
"minimist": "0.0.8" "minimist": "0.0.8"
} }
}, },
"nth-check": { "source-list-map": {
"version": "1.0.2", "version": "2.0.1",
"resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.2.tgz", "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
"integrity": "sha512-WeBOdju8SnzPN5vTUJYxYUxLeXpCaVP5i5e0LF8fg7WORF2Wd7wFX/pk0tYZk7s8T+J7VLy0Da6J1+wCT0AtHg==", "integrity": "sha512-qnQ7gVMxGNxsiL4lEuJwe/To8UnK7fAnmbGEEH8RpLouuKbeEm0lhbQVFIrNSuB+G7tVrAlVsZgETT5nljf+Iw=="
},
"source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
},
"webpack-sources": {
"version": "1.4.3",
"resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.4.3.tgz",
"integrity": "sha512-lgTS3Xhv1lCOKo7SA5TjKXMjpSM4sBjNV5+q2bqesbSPs5FjGmU6jjtBSkX9b4qW87vDIsCIlUPOEhbZrMdjeQ==",
"requires": { "requires": {
"boolbase": "~1.0.0" "source-list-map": "^2.0.0",
"source-map": "~0.6.1"
} }
},
"readable-stream": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.0.6.tgz",
"integrity": "sha512-9E1oLoOWfhSXHGv6QlwXJim7uNzd9EVlWK+21tCU9Ju/kR0/p2AZYPz4qSchgO8PlLIH4FpZYfzwS+rEksZjIg==",
"requires": {
"inherits": "^2.0.3",
"string_decoder": "^1.1.1",
"util-deprecate": "^1.0.1"
}
},
"safe-buffer": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
"integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
},
"string_decoder": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
"integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
"requires": {
"safe-buffer": "~5.1.0"
}
},
"util-deprecate": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
"integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
} }
} }
} }

View File

@ -9,7 +9,7 @@
"author": "Philipp Dieter <philipp@glanzstueck.agency>", "author": "Philipp Dieter <philipp@glanzstueck.agency>",
"license": "ISC", "license": "ISC",
"dependencies": { "dependencies": {
"cheerio": "^0.22.0", "mkdirp": "^0.5.1",
"mkdirp": "^0.5.1" "webpack-sources": "^1.4.3"
} }
} }