Running ionic serve does not use my svg images

ionic-v1
1

Hi, in the application I am building with Ionic1 (and I modified gulp file a bit so that I can use cofeescript) I put some svg pictures in the www/img folder. But, neither with “ionic serve” nor with " ionic run --livereload --consolelogs android" their are used, yet all png/jpg pictures are used. (When I inspect the page with Chromium and look at Sources tab, I see that they are not in the img folder).

So do I need to modify some configuration file for Ionic to use those svg ? Regards

2

Looks like the image build/copy process is somewhere within Ionic rather than there in the gulpfile, but, you should just add like an svg task to your gulp file and have it run before build.

Something like:

gulp.task('svg', function() {
  return gulp.src('./img/*.svg')
    .pipe(gulp.dest('www/img'));
});

Then just make sure that task runs before build and during live reload. If you’ve already done that to add coffeescript support this should be no problem…

3

Thank you. But in fact it is not a matter of copying files, as I managed to show the image, but not the way I want to

  • I put something like “<object data=“img/chess_bd.svg” type=“image/svg+xml”><object>” in order to check that the picture is available, and it is

  • But I wanted to add it to a svg element that I am building by Javascript, and it seems that the error is from the building code.

4

Hmmm, I guess I’m not really following you. Can you create an example? Based on this quote in your original question:[quote=“loloof64, post:1, topic:47505”]
(When I inspect the page with Chromium and look at Sources tab, I see that they are not in the img folder).
[/quote]

I assumed they weren’t getting copied. Maybe make a CodePen and/or some code copy-pasted in here so I can see what you mean?

5

In fact, I noticed something with my Ionic project, based on the Tabs starter

  • Pictures are only loaded when you reference it.

  • But Chromium inspector does not show svg pictures, though they are availables.