diff options
-rw-r--r-- | app/assets/javascripts/lib/utils/icons_path.js | 3 | ||||
-rw-r--r-- | app/assets/javascripts/vue_shared/components/icon.vue | 4 | ||||
-rw-r--r-- | config/webpack.config.js | 14 |
3 files changed, 20 insertions, 1 deletions
diff --git a/app/assets/javascripts/lib/utils/icons_path.js b/app/assets/javascripts/lib/utils/icons_path.js new file mode 100644 index 00000000000..1a1c3c8e7b3 --- /dev/null +++ b/app/assets/javascripts/lib/utils/icons_path.js @@ -0,0 +1,3 @@ +// any import of '@gitlab/svgs/dist/icons.svg' will be overridden with this +// to avoid asset duplication between sprockets and webpack +export default gon && gon.sprite_icons; diff --git a/app/assets/javascripts/vue_shared/components/icon.vue b/app/assets/javascripts/vue_shared/components/icon.vue index 41c4c861566..fa89473da62 100644 --- a/app/assets/javascripts/vue_shared/components/icon.vue +++ b/app/assets/javascripts/vue_shared/components/icon.vue @@ -1,4 +1,6 @@ <script> +import iconsPath from '@gitlab/svgs/dist/icons.svg'; + // only allow classes in images.scss e.g. s12 const validSizes = [8, 10, 12, 14, 16, 18, 24, 32, 48, 72]; let iconValidator = () => true; @@ -84,7 +86,7 @@ export default { computed: { spriteHref() { - return `${gon.sprite_icons}#${this.name}`; + return `${iconsPath}#${this.name}`; }, iconTestClass() { return `ic-${this.name}`; diff --git a/config/webpack.config.js b/config/webpack.config.js index 4b6a9e4b99e..442b4b4c21e 100644 --- a/config/webpack.config.js +++ b/config/webpack.config.js @@ -90,6 +90,12 @@ const alias = { // the following resolves files which are different between CE and EE ee_else_ce: path.join(ROOT_PATH, 'app/assets/javascripts'), + + // override loader path for icons.svg so we do not duplicate this asset + '@gitlab/svgs/dist/icons.svg': path.join( + ROOT_PATH, + 'app/assets/javascripts/lib/utils/icons_path.js', + ), }; if (IS_EE) { @@ -158,7 +164,15 @@ module.exports = { loader: 'graphql-tag/loader', }, { + test: /icons\.svg$/, + loader: 'file-loader', + options: { + name: '[name].[hash:8].[ext]', + }, + }, + { test: /\.svg$/, + exclude: /icons\.svg$/, loader: 'raw-loader', }, { |