# Get asset path from javascript

**URL:** https://discourse.roots.io/t/get-asset-path-from-javascript/12802
**Category:** sage
**Tags:** webpack, sage9
**Created:** 2018-06-29T08:00:50Z
**Posts:** 8

## Post 1 by @aitor — 2018-06-29T08:00:50Z

After passing template directory URI to javascript with `wp_localize_script`, I can set up the assets path to give a marker to google map:

```
// assets/scripts/routes/example.js
var iconBase = sj.templateDirectoryUri + '/dist/images/';
icon: iconBase + 'sj-logo-marker.png',
```

This returns a path that seems right:

```
http://localhost:3000/wp/dist/images/sj-logo-marker.png
```

But I get 404 in the console. Also, althoug this PNG is in its place:

![46](https://discourse.roots.io/uploads/default/original/2X/d/d39fdf829f60c1d4fec6a57f94f6dda77009a25d.png)

it is not in the source inpector (there is no `dist/images/` folder):

![24](https://discourse.roots.io/uploads/default/original/2X/4/47cc93921f4c0f83e9e22a6cdbe00481eb3d432b.png)

What is the right way to reference assets from JS?

---

## Post 2 by @danielroe — 2018-06-29T08:22:25Z

The path should be something like: `/app/themes/sj/dist/images/sj-logo-marker.png` not `/wp/dist/images/sj-logo-marker.png`

---

## Post 3 by @aitor — 2018-06-29T08:43:20Z

Thank you. After some years I have a little mess with paths and URIs in my head.

Reminder for me:

```
$sj_data = array(
   'homeUrl => get_bloginfo( 'url' ),
);
```

JS:

```
var iconBase = sj.homeUrl + '/app/themes/sj/dist/images/';
```

---

## Post 4 by @knowler — 2018-06-29T15:32:26Z

> [@aitor](#):
>
> JS:
> 
> ```
> var iconBase = sj.homeUrl + '/app/themes/sj/dist/images/';
> ```

Not super necessary, but you can make that syntax a tad nicer with a [template literal](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals):

```
var iconBase = `${sj.homeUrl}/app/themes/sj/dist/images/`;
```

---

## Post 5 by @aitor — 2018-06-29T17:29:14Z

Done! thanks for the advice.

---

## Post 6 by @ana — 2018-07-09T12:22:31Z

I’m trying to do the same thing here, could you please tell me where to insert the `wp_localize_script` and your `$sj_data` array?

---

## Post 7 by @codepuncher — 2018-07-09T12:52:45Z

Place it in `setup.php` amongst the standard `wp_enqueue_script` calls.

---

## Post 8 by @aitor — 2018-07-09T13:20:24Z

Here you have it:

[https://bitbucket.org/aitormendez/superbiajuridico/src/c6144a3e2281249c97ce9946fbbf0330a5f0a716/web/app/themes/sj/app/setup.php#lines-132:144](https://bitbucket.org/aitormendez/superbiajuridico/src/c6144a3e2281249c97ce9946fbbf0330a5f0a716/web/app/themes/sj/app/setup.php#lines-132:144)