Webpack中使用完整的Vue

1.cnpm i vue -S引入包
2.在main.js文件中首行添加import Vue from 'vue'
然后再添加:

let vm = new Vue({
    el:'#app',
    data:{
        msg:'test'
    }
})

3.在webpack.config.js添加一个节点resolve

,
    resolve: {
        alias:{
            "vue$":"vue/dist/vue.js"
        }
    }

4.最后使用即可

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
<p>{{msg}}</p>
</div>
</body>
</html>

使用完整的Vue来显示组件

1.定义一个组件
let login = { template:'<h1>这是login组件</h1>' }
2.在vm实例中注册组件

,
    components:{
        login
    }

3.使用即可

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
    <login></login>
</div>
</body>
</html>
发布了103 篇原创文章 · 获赞 5 · 访问量 2260

猜你喜欢

转载自blog.csdn.net/weixin_42452726/article/details/102510182