Vue: adding support for templateUrl as an optional

[siddmegadeth]

What problem does this feature solve?

Based on your blog regarding your view on template URL i support your purpose for not including
templateURL in vue.js

But given the complexity there are some project which requires templateURL and are web applications
which are not targeted towards performance. Such application which in vue.js requires a lot of Component written with in line html. given the complexity its a hard to debug at time. some teams do not have full stack people.
Requesting to provide support for templateURL in vue.js for making vue.js as a standard choice for creating large scale enterprise level application.

This is a feature request.

What does the proposed API look like?

// Define a new component called todo-item
Vue.component('todo-item', {
templateUrl : '

This is a todo

'
})

[posva]

This is actually already achievable in userland, and we'll probably keep it that way. Because components can be functions that return promises, you can handle fetching the template inside of that promise:

const Home = async () => {
     const template = await fetch(templateUrl)
     return {
          template
    }
}

Here's a working example in a jsfiddle using promises: http://jsfiddle.net/z9f13t6m/

[siddmegadeth]

Thank you for this.The JSFiddle provided still fetches a inline html tag not a .html file.
But we are looking for out of the box solution just like AngularJS. This also does not work out
for our application.

[posva]

You only need to use axios or a similar lib to fetch the HTML file 😉
You can ask more questions on the forum or the Discord server

[Akryum]

The JSFiddle provided still fetches a inline html tag not a .html file.

The fiddle is a fake fetch because you can't put an html file on jsfiddle. In your real project, you can absolutely make a request to your server to retrieve an html file. For example, with the fetch API, it's very easy as seen in @posva example:

const Home = async () => {
  const template = await fetch('http://yourserver.com/templates/foo.html')
  return {
    template,
    // other component options...
  }
}

As @posva said, you can use anything you want to retrieve the template content (not only fetch).

But we are looking for out of the box solution just like AngularJS.

This works out-of-the-box and you don't need any additional library other than Vue. It is also way more powerful than AngularJS, since you are not limited to the template, you can fetch other options or the entire component definition in an asynchronous way.

This also does not work out for our application.

There is no reason this shouldn't work.

[phplego]

In my view in is a bit opinionated to have only template but not templateUrl. I wrote many components using templateUrl and it's one of my favorite options. And now it's frustrating for me.
I don't care too much about speed or how many HTTP requests have been sent. Why the hell vue doesn't allow me to do what I want? :)

let us choose

[AccessViolator]

I agree with @phplego - let US choose.
I also suppose a template loaded this 'manual' way wouldn't be cached in a template cache, would it?
This should be reopened.

[posva]

Please just read the comments above