Vue is not defined

Question

I am trying to build a demo app with Vue js  What I am getting is an odd error that Vue is not defined    lt  doctype html gt   lt html lang  en  gt   lt head gt       lt meta charset  UTF-8  gt       lt title gt Vue JS Intro lt  title gt   lt  head gt   lt body gt       lt div id  demo  gt           lt p gt   message   lt  p gt           lt input v-model  message  gt       lt  div gt        lt script type  JavaScript  src  https   cdnjs cloudflare com ajax libs vue 1 0 18 vue min js  gt  lt  script gt        lt script gt          var demo   new Vue               el    demo               data                    message   Hello Vue js                                 lt  script gt   lt  body gt   lt  html gt    What did I miss here  This is not a CDN issue as I also downloaded the library from the official website  used it and got the same result     index html 15 Uncaught ReferenceError  Vue is not defined

User · Answer

try to fix type  JavaScript  to type  text javascript  in you vue js srcipt tag  or just remove it   Modern browsers will take script tag as javascript as default

User · Answer

Sometimes the problem may be if you import that like this   const Vue   window vue    this may overwrite the original Vue reference

User · Answer

jsBin demo   You missed the order  first goes        lt script src  https   cdnjs cloudflare com ajax libs vue 1 0 18 vue min js  gt  lt  script gt    and then     lt script gt      var demo   new Vue           el    demo           data                message   Hello Vue js                      lt  script gt     And type  JavaScript  should be type  text javascript   or rather nothing at all

User · Answer

I found two main problems with that implementation  First  when you import the vue js script you use type  JavaScript  as content-type which is wrong  You should remove this type parameter because by default script tags have text javascript as default content-type  Or  just replace the type parameter with the correct content-type which is  type  text javascript    The second problem is that your script is embedded in the same HTML file means that it may be triggered first and probably the vue js file was not loaded yet  You can fix this using a jQuery snippet   function                  or adding a javascript function as shown in this example     x000D   x000D     Verifies if the document is ready x000D  function ready f    x000D     in  test document readyState    setTimeout  ready     f        9    f    x000D    x000D   x000D  ready function     x000D    var demo   new Vue   x000D      el    demo   x000D      data    x000D        message   Hello Vue js   x000D        x000D       x000D      x000D   lt script src  https   cdnjs cloudflare com ajax libs vue 2 5 17 vue js  gt  lt  script gt  x000D   lt div id  demo  gt  x000D     lt p gt   message   lt  p gt  x000D     lt input v-model  message  gt  x000D   lt  div gt  x000D   x000D   x000D

User · Answer

I needed to add the script below to index html inside the HEAD tag     lt script src  https   cdn jsdelivr net npm vue dist vue js  gt  lt  script gt    But in your case  since you don t have index html  just add it to your HEAD tag instead   So it s like    lt  doctype html gt   lt html gt   lt head gt      lt script src  https   cdn jsdelivr net npm vue dist vue js  gt  lt  script gt   lt  head gt   lt body gt       lt  body gt   lt  html gt

User · Answer

I got this error but as undefined due to the way I included js files  Initailly i had    lt script src    vue blade-account-update-credit-card-vue js  asp-append-version  true  gt  lt  script gt   lt script src    lib vue vue v2 5 16 js  gt  lt  script gt    in the end of my  cshtml page  GOT Error  Vue not Defined but later I changed it to   lt script src    lib vue vue v2 5 16 js  gt  lt  script gt    lt script src    vue blade-account-update-credit-card-vue js  asp-append-version  true  gt  lt  script gt    and magically it worked  So i assume that vue js needs to be loaded on top of the  vue

[javascript] Vue is not defined

Examples related to javascript

Examples related to html

Examples related to vue.js