PolymerElements / gold-cc-input

An input element that only allows credit card numbers
https://webcomponents.org/element/PolymerElements/gold-cc-input
13 stars 23 forks source link

Icon is not shown after using gulp #53

Open victoriaSh opened 7 years ago

victoriaSh commented 7 years ago

Description

Mastercard or visa icons are not shown when using gulp from SPA-example Gulp configuration is not adding images to a compressed project. I resolved this by adding icons to project's root image folder and changing a path in the source code of gold-cc-input.

If someone has a more graceful solution?

Steps to reproduce

  1. Put a gold-cc-input element in the page.
  2. Compress app using gulp (standard configuration from SPA example).
  3. Open app, fill a card number. There is an error - "visa.png not found".
ZachMoreno commented 6 years ago

I was able to reproduce. The issue doesn't seem to be related to gulp tasks because it also occurs when using the polymer-cli polymer build command. The /images folder & it's contents are not copied to /build/bower_components/gold-cc-input folder.

ZachMoreno commented 6 years ago

It's also an issue with the gold-cc-cvc-input component's images

ZachMoreno commented 6 years ago

I was able to work around the issue by adding the image paths in the polymer.json file

"extraDependencies": [
    "manifest.json",
    "bower_components/webcomponentsjs/webcomponents-lite.min.js",
    ...
    "bower_components/gold-cc-cvc-input/cvc_hint.png",
    "bower_components/gold-cc-cvc-input/cvc_hint_amex.png",
    "bower_components/gold-cc-input/images/amex.png",
    "bower_components/gold-cc-input/images/diners_club.png",
    "bower_components/gold-cc-input/images/discover.png",
    "bower_components/gold-cc-input/images/jcb.png",
    "bower_components/gold-cc-input/images/mastercard.png",
    "bower_components/gold-cc-input/images/visa.png"
  ]