Parcel: 🐛"build" breaks dependencies detection in <svg><use/>
Choose one: is this a 🐛 bug report or 🙋 feature request?
🐛Bug
SVG files linked with <use> are detected correctly with parcel watch but they're left untouched when using parcel build.
🎛 Configuration (.babelrc, package.json, cli command)
No config
<!-- index.html -->
<!DOCTYPE html>
<svg xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="file.svg#all"/>
</svg>
<!-- file.svg -->
<svg xmlns="http://www.w3.org/2000/svg" id="all"><rect x="0" y="0" width="100" height="100"/></svg>
parcel watch --no-cache
```sh
parcel build --no-cache
### 🤔 Expected Behavior
The linked SVG is detected and processed.
```html
<!-- index.html -->
<!DOCTYPE html><svg xmlns:xlink="http://www.w3.org/1999/xlink"><use xlink:href="/dist/fe03c3efee964b0b65876cb335d8782f.svg#all"></use></svg>
So two files should be generated.
$ tree dist
dist
├── e4746ad4854ea1f42b9990e63012fe62.html
└── fe03c3efee964b0b65876cb335d8782f.svg
0 directories, 2 files
This works correctly in parcel watch
😯 Current Behavior
The use tag in the index.html is left untouched:
<!DOCTYPE html><svg xmlns:xlink="http://www.w3.org/1999/xlink"><use xlink:href="file.svg#all"/></svg>
And only one file is generated:
$ ./node_modules/.bin/parcel build --no-cache
✨ Built in 1.06s.
dist/e4746ad4854ea1f42b9990e63012fe62.html 102 B 1.00s
$ tree dist
dist
└── e4746ad4854ea1f42b9990e63012fe62.html
0 directories, 1 file
💻 Code Sample
# create the two files
$ echo '<!DOCTYPE html><svg xmlns:xlink="http://www.w3.org/1999/xlink"><use xlink:href="file.svg#all"/></svg>' > index.html
'<svg xmlns="http://www.w3.org/2000/svg" id="all"><rect x="0" y="0" width="100" height="100"/></svg>'
$ echo '<svg xmlns="http://www.w3.org/2000/svg" id="all"><rect x="0" y="0" width="100" height="100"/></svg>' > file.svg
# build creates one file
$ parcel build
# watch creates 2 files
$ parcel watch
🌍 Your Environment
| Software | Version(s) |
| ---------------- | ---------- |
| Parcel | 1.6.2
| Node | 5.6.0
| npm/Yarn | 5.7.1
| Operating System | macOS 10.13.3
fregante
All 3 comments
Interim solution: create a .htmlnanorc file
{
minifySvg: false
}
After some investigating it appears htmlnano transforms svg's ast into a minified content string:
Before HTMLnano
{
"tag": "svg",
"attrs": {
"xmlns:xlink": "http://www.w3.org/1999/xlink"
},
"content": [
"\n ",
{
"tag": "use",
"attrs": {
"xlink:href": "./file.svg#all"
}
},
"\n "
]
}
After HTMLnano
{
"tag": false,
"attrs": {},
"content": "<svg xmlns:xlink=\"http://www.w3.org/1999/xlink\"><use xlink:href=\"./file.svg#all\"/></svg>"
}
Not sure how to get past this from within parcel, as htmlnano executes before the ast walker
DeMoorJasper
on 18 Mar 2018
Thank you!
fregante
on 20 Mar 2018
Related issues
mnn
·
3Comments
dotdash
·
3Comments
termhn
·
3Comments
Niggler
·
3Comments
will-stone
·
3Comments
Most helpful comment
Interim solution: create a
.htmlnanorcfile