安装Vue的三种方式
- 直接下载引入
下载vue.js
<script src="vue.js地址"></script>
- CDN引入
<!-- CDN引入外部资源 -->
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
- npm安装
首先
npm install vue --save
配置webpack.config.js：
const path=require('path')
module.exports={
entry:'./src/main.js',
output:{
// path:'./dist', 报错，需要填写绝对路径
path: path.resolve(__dirname,'dist'),
filename:'bundle.js'
},
resolve:{
alias:{
"vue$":"vue/dist/vue.js"
}
}
}
其次，使用Vue
import Vue from 'vue'
const ap=new Vue({
el: '#app',
data:{
message:'Hello Webpack'
}
})
报错处理：
[Vue warn]: Cannot find element: #app
在html代码中将引入放到div后面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Webpack配置Vue</title>
</head>
<body>
<!--<script src="./dist/bundle.js"></script> 放在这里报错了-->
<div id="app">
{{message}}
</div>
<script src="./dist/bundle.js"></script>
</body>
</html>
4411
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
