{"action":"closed","issue":{"url":"https://api.github.com/repos/erikringsmuth/app-router/issues/81","labels_url":"https://api.github.com/repos/erikringsmuth/app-router/issues/81/labels{/name}","comments_url":"https://api.github.com/repos/erikringsmuth/app-router/issues/81/comments","events_url":"https://api.github.com/repos/erikringsmuth/app-router/issues/81/events","html_url":"https://github.com/erikringsmuth/app-router/issues/81","id":57709221,"number":81,"title":"Bundling templates with controlling JavaScript","user":{"login":"nomego","id":960553,"avatar_url":"https://avatars.githubusercontent.com/u/960553?v=3","gravatar_id":"","url":"https://api.github.com/users/nomego","html_url":"https://github.com/nomego","followers_url":"https://api.github.com/users/nomego/followers","following_url":"https://api.github.com/users/nomego/following{/other_user}","gists_url":"https://api.github.com/users/nomego/gists{/gist_id}","starred_url":"https://api.github.com/users/nomego/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nomego/subscriptions","organizations_url":"https://api.github.com/users/nomego/orgs","repos_url":"https://api.github.com/users/nomego/repos","events_url":"https://api.github.com/users/nomego/events{/privacy}","received_events_url":"https://api.github.com/users/nomego/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/erikringsmuth/app-router/labels/design%20discussion","name":"design discussion","color":"e6e6e6"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":24,"created_at":"2015-02-14T22:37:50Z","updated_at":"2015-03-05T09:25:33Z","closed_at":"2015-03-05T09:25:33Z","body":"I've been experimenting with a way to bundle the JavaScript nicely with template views.\r\n\r\nAs far as I've noticed, I cannot easily access query/path parameters in a nested template (or can I?) so there should only be one (root) `<template>` tag in a template view.\r\n\r\nThe best I've come up with is a root `<template>` element (that cannot be auto-binding, this will trigger the script twice) with an inline `<script>` tag that finds its template with `document.currentScript.templateInstance.model`. Not sure if I can count on this being set to the template?\r\n\r\nHowever, ideally, I'd like to separate the template and its JavaScript and only vulcanize/combine them before publishing to production.\r\n\r\nWhen adding a `src` attribute to the `<script>` tag, the tag gets loaded two times, once when the HTML import is run, and once when the `<template>` tag gets inserted into the DOM.\r\nDuring the HTML import, the relative path is correct, that is, if the template is at `/views/module1/view1.html` and the `src` tag says `view1.js`, `/views/module1/view1.js` is imported.\r\nBut when inserted into the DOM, the relative path is lost and the browser tries to load `/view1.js`.\r\n\r\nOne way to get around the second import is to move the `<script src>` tag out of the root template tag.\r\nThat way, it's only loaded during the HTML import and with the expected relative path.\r\n\r\nHowever, when doing this, there are two issues:\r\n\r\n1. The `<script>` element is located in its own, disconnected DOM, so finding the corresponding template with relative JavaScript like code like above or `document.currentScript.parentElement.querySelector('template[is=\"auto-binding\"]')` wouldn't work.\r\n2. The script will be run before the template is inserted to the DOM, so to find the template we'd also have to wait for that event to happen.\r\n\r\nAlso regardless of the solution, will it be possible to vulcanize/bundle multiple template view \"bundles\" into one file for the client ?"}}