mad-star-studio/element-web
2
0
Fork 0
Code Pull requests Activity

add svgr loader for icons (#21248)

Browse source 
* add svgr loader for icons

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fix config, move dep to dev

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add svg types

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add aria-hidden and role=img to svg

Signed-off-by: Kerry Archibald <kerrya@element.io>

* make svgProps explicitly overridable

Signed-off-by: Kerry Archibald <kerrya@element.io>

* role presentatino

Signed-off-by: Kerry Archibald <kerrya@element.io>

* update copyright

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2022-03-02 10:14:30 +01:00 • committed by GitHub
parent 240c3be014
commit 9a17a61809
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 188 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

47
webpack.config.js
View file

@ -455,7 +455,52 @@ module.exports = (env, argv) => {
},
},
{
test: /\.(gif|png|svg|ttf|woff|woff2|xml|ico)$/,
test: /\.svg$/,
use: [
{
loader: '@svgr/webpack',
options: {
namedExport: 'Icon',
svgProps: {
role: 'presentation',
'aria-hidden': true,
},
// props set on the svg will override defaults
expandProps: 'end',
svgoConfig: {
plugins: {
// generates a viewbox if missing
removeDimensions: true,
},
},
esModule: false,
name: '[name].[hash:7].[ext]',
outputPath: getAssetOutputPath,
publicPath: function (url, resourcePath) {
const outputPath = getAssetOutputPath(url, resourcePath);
return toPublicPath(path.join("../..", outputPath));
},
},
},
{
loader: 'file-loader',
options: {
esModule: false,
name: '[name].[hash:7].[ext]',
outputPath: getAssetOutputPath,
publicPath: function (url, resourcePath) {
// CSS image usages end up in the `bundles/[hash]` output
// directory, so we adjust the final path to navigate up
// twice.
const outputPath = getAssetOutputPath(url, resourcePath);
return toPublicPath(path.join("../..", outputPath));
},
},
},
]
},
{
test: /\.(gif|png|ttf|woff|woff2|xml|ico)$/,
// Use a content-based hash in the name so that we can set a long cache
// lifetime for assets while still delivering changes quickly.
oneOf: [