一般的なWebプロジェクトはVUE開発(参照.vueファイルコンポーネント)を導入する
通常のWebプロジェクトにはvueを埋め込むことができ、vueのjsをページに導入するだけで使用できます.例は次のとおりです.
<div id="app">
{
{msg}}}
</div>
<!-- ， -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"/>
<!-- ， -->
<!-- <script src="https://cdn.jsdelivr.net/npm/vue"></script> -->
<script>
new Vue({
el: '#app',
data: function () {
return {
msg:"Hello world!"
}
}
});
</script>
</code></pre>
<p> web ， ， ：</p>
<pre><code>// button-counter
Vue.component('button-counter', {
data: function () {
return {
count: 0
}
},
template: '<button v-on:click="count++">You clicked me {
{ count }} times.</button>'
})</code></pre>
<p> ， ， template ， ， .vue 。</p>
<p>http-vue-loader build vue ， ：</p>
<p>1、 ， my-component.vue ， ：</p>
<pre><code><template>
<div class="hello">{
{msg}}</div>
</template>
<script>
module.exports = {
data: function() {
return {
msg: 'Hello world!'
}
}
}
</script>
<style>
.hello {
background-color: #ffe;
}
</style></code></pre>
<p>2、 vue http-vue-loader js </p>
<pre><code><script src="js/vue.js"/>
<script src="js/httpVueLoader.js"/></code></pre>
<p> ：https://download.csdn.net/download/ajian132/12054208 （ ）</p>
<p>3、 httpVueLoader </p>
<pre><code><div id="app">
<my-component/>
</div>
<script type="text/javascript">
new Vue({
el: '#app',
components: {
'my-component': httpVueLoader('components/my-component.vue')
}
});
</script></code></pre>
<p> </p>
</div>
</div>
</div>
</div>