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 mand 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="/[email protected]"></script>
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 mand 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./[email protected]"></script>
- I should add: If someone could point me to a direction where I can look at a template that would incorporate html, css, and javascript/vue in one file. That would be great! – burgoyne Commented Jan 14, 2019 at 20:58
- Are you looking for single file ponents? vuejs/v2/guide/single-file-ponents.html – Terry Commented Jan 14, 2019 at 20:59
- Well that shows Vue examples in a .vue file. I was hoping to just have my .css files, my .html files, and .js files (or a pilation of all three into one file) and incorporate Vue into that. Instead of creating a Vue project. – burgoyne Commented Jan 14, 2019 at 21:02
- Oh, that's not how I understood your original ment. Then just load VueJS from any CDN, that should work fine, e.g. from cdnjs.cloudflare./ajax/libs/vue/2.5.22/vue.min.js – Terry Commented Jan 14, 2019 at 21:03
- Just deleted my last ment. Thanks. So I can load that from cdn, and put it into my html file, and then use Vue code? – burgoyne Commented Jan 14, 2019 at 21:05
1 Answer
Reset to default 6I think this link will help you.
https://v2.vuejs/v2/guide/#Getting-Started
A little exemple.
Html file.
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr/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 piling the .vue file into a valid javascript file.