Menu icon Foundation
Inlining / Build gives images wrong paths

I'm using 2.2.1.

Have an email that I've created that works just fine, in the preview system (i.e. via npm start) with images located in the src/assets/img folder. However when I process it using the npm run build command the resulting index.html file is broken - the paths used for image sources are wrong and I don't know why / what to do about it.

The inlining process puts the html file for the email in the dist folder, and puts copies of the images needed into the dist/assets/img folder. But the image paths in the index.html file are all set to ../assets/img/...image name... - they should be set to assets/img/...image name...

This is easy enough to fix manually, but I'm clearly doing something wrong - but not sure what.  My setup used to work OK prior to updating to 2.2.1 (was on 2.1.x before).

Thanks a lot for any guidance.

inlinebuildimage paths

I'm using 2.2.1.

Have an email that I've created that works just fine, in the preview system (i.e. via npm start) with images located in the src/assets/img folder. However when I process it using the npm run build command the resulting index.html file is broken - the paths used for image sources are wrong and I don't know why / what to do about it.

The inlining process puts the html file for the email in the dist folder, and puts copies of the images needed into the dist/assets/img folder. But the image paths in the index.html file are all set to ../assets/img/...image name... - they should be set to assets/img/...image name...

This is easy enough to fix manually, but I'm clearly doing something wrong - but not sure what.  My setup used to work OK prior to updating to 2.2.1 (was on 2.1.x before).

Thanks a lot for any guidance.

Corey Schaaf about 3 years ago

In your image path, maybe try using the {{root}}/path of your images/ 

Based on some of my own test (which I use the trick above in reference to my stylesheets) this might actually work for your use case as well.