新建文件夹parcel-vue
yarn init -y //初始化package.json
安装依赖
yarn add vue parcel-bundler vue-template-compiler
新建index.html
//index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="root"></div>
<script src="./src/index.js"></script>
</body>
</html>
新建文件夹src,src下新建index.js、app.vue
//index.js
import Vue from 'vue'
import App from './app.vue'
new Vue({
el: '#root',
render: h => h(App)
})
//app.vue
<template>
<div class="vuedemo">{{demo}}</div>
</template>
<script>
export default {
data () {
return {
demo:"you win"
}
}
}
</script>
<style>
.vuedemo{
color: #333;
font-size: 36px;
}
</style>
使用parcel打包
parcel index.html
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。