diff --git a/packages/core/parcel/src/assets/HTMLAsset.js b/packages/core/parcel/src/assets/HTMLAsset.js index bdfe611c205..d6ff6e8f0c9 100644 --- a/packages/core/parcel/src/assets/HTMLAsset.js +++ b/packages/core/parcel/src/assets/HTMLAsset.js @@ -4,6 +4,7 @@ const api = require('posthtml/lib/api'); const urlJoin = require('../utils/urlJoin'); const render = require('posthtml-render'); const posthtmlTransform = require('../transforms/posthtml'); +const htmlnanoTransform = require('../transforms/htmlnano'); const isURL = require('../utils/is-url'); // A list of all attributes that may produce a dependency @@ -22,7 +23,7 @@ const ATTRS = { href: ['link', 'a', 'use'], srcset: ['img', 'source'], poster: ['video'], - 'xlink:href': ['use'], // Deprecated since SVG 2, throws error in svgo + 'xlink:href': ['use'], content: ['meta'] }; @@ -136,6 +137,12 @@ class HTMLAsset extends Asset { await posthtmlTransform(this); } + async transform() { + if (this.options.minify) { + await htmlnanoTransform(this); + } + } + generate() { let html = this.isAstDirty ? render(this.ast) : this.contents; return {html}; diff --git a/packages/core/parcel/src/transforms/htmlnano.js b/packages/core/parcel/src/transforms/htmlnano.js new file mode 100644 index 00000000000..1b9c9092a27 --- /dev/null +++ b/packages/core/parcel/src/transforms/htmlnano.js @@ -0,0 +1,21 @@ +const posthtml = require('posthtml'); +const htmlnano = require('htmlnano'); + +module.exports = async function(asset) { + await asset.parseIfNeeded(); + + const htmlNanoConfig = asset.package.htmlnano || + (await asset.getConfig(['.htmlnanorc', '.htmlnanorc.js'])) || { + collapseWhitespace: 'conservative', + minifyCss: { + safe: true + } + }; + + let res = await posthtml([htmlnano(htmlNanoConfig)]).process(asset.ast, { + skipParse: true + }); + + asset.ast = res.tree; + asset.isAstDirty = true; +}; diff --git a/packages/core/parcel/src/transforms/posthtml.js b/packages/core/parcel/src/transforms/posthtml.js index c9f8ebaaa58..5dca2d57f15 100644 --- a/packages/core/parcel/src/transforms/posthtml.js +++ b/packages/core/parcel/src/transforms/posthtml.js @@ -1,6 +1,5 @@ const loadPlugins = require('../utils/loadPlugins'); const posthtml = require('posthtml'); -const htmlnano = require('htmlnano'); module.exports = async function(asset) { let config = await getConfig(asset); @@ -29,19 +28,6 @@ async function getConfig(asset) { config = config || {}; config.plugins = await loadPlugins(config.plugins, asset.name); - - if (asset.options.minify) { - const htmlNanoConfig = asset.package.htmlnano || - (await asset.getConfig(['.htmlnanorc', '.htmlnanorc.js'])) || { - collapseWhitespace: 'conservative', - minifyCss: { - safe: true - } - }; - - config.plugins.push(htmlnano(htmlNanoConfig)); - } - config.skipParse = true; return config; } diff --git a/packages/core/parcel/test/html.js b/packages/core/parcel/test/html.js index 71b7750a9a6..839219e17d7 100644 --- a/packages/core/parcel/test/html.js +++ b/packages/core/parcel/test/html.js @@ -519,4 +519,19 @@ describe('html', function() { ] }); }); + + it('should bundle svg files correctly', async function() { + let b = await bundle(__dirname + '/integration/html-svg/index.html'); + + assertBundleTree(b, { + name: 'index.html', + assets: ['index.html'], + childBundles: [ + { + type: 'svg', + assets: ['file.svg'] + } + ] + }); + }); }); diff --git a/packages/core/parcel/test/integration/html-svg/file.svg b/packages/core/parcel/test/integration/html-svg/file.svg new file mode 100644 index 00000000000..5bf00e06842 --- /dev/null +++ b/packages/core/parcel/test/integration/html-svg/file.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/core/parcel/test/integration/html-svg/index.html b/packages/core/parcel/test/integration/html-svg/index.html new file mode 100644 index 00000000000..d09886bcc84 --- /dev/null +++ b/packages/core/parcel/test/integration/html-svg/index.html @@ -0,0 +1,4 @@ + + + + \ No newline at end of file