一、进入Vue官网下载 Vue.js 开发版
点击进入官网下载
注意:这里需要下载开发版
二、进入 Chrome 网上商店下载插件
- 直接在搜索框中搜索 vue.js-devtools,搜索结果如下:
- 点击进入详情页,点击 添加至Chrome 按钮
三、打开 chorme 浏览器扩展程序管理页面
开启 ** 允许访问文件网址**
四、准备一个 vue初体验.html
- 代码如下:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">{{ message }}</div>
// 将下载的 开发版 vue.js 引入
<script src="../vue.js"></script>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
</script>
</body>
</html>
- 用 chorme 浏览器打开这个页面,按F12打开控制台