CODEWITHSUNDEEP
javascripthtmlcssvue.js
burgoyne
burgoyne

Reputation: 163

Using Vue.js in a standalone project

I am trying to learn Vue.js for work, and I seem to have the syntax down, but I have a question about creating an overall project.

So far, to create a project, I have had to use npm to create the project (or start the ui, and do it from there).

But I am wondering how I can include Vue without always running serve via command prompt to render it in my browser. For example, if I am creating a website front end with html, css, and some javascript, can I somehow import Vue to that and use it?

I assume with something like this:

<script src="https://unpkg.com/[email protected]"></script>

Upvotes: 5

Views: 3337

Answers (1)

William Lapointe
William Lapointe

Reputation: 76

I think this link will help you.

https://v2.vuejs.org/v2/guide/#Getting-Started

A little exemple.

Html file.

<!DOCTYPE html>
<html>
  <head>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
  </head>
  <body>
    <div id="app">
      <p>{{ message }}</p>
    </div>
    <script src="index.js"></script>
  </body>
</html>

Pure js file.

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  }
})

But if you have a .vue files like this:

<template>
  <!- ... ->
</template>
<script>
  // ...
</script>

You don't have the choice, you need to run the script npm run serve or yarn serve for compiling the .vue file into a valid javascript file.

Upvotes: 6

Related Questions