Vue 安装 vue的基本使用 vue的初步使用步骤
1. 资源: https://cn.vuejs.org/v2/guide/#%E8%B5%B7%E6%AD%A5
进入官网学习
2. 点击安装,要把vue下载到本地文件的根目录中,不要选择压缩版的,这样在控制台就能显示自己下载运用的vue拓展程序


3.把它放到文件根目录

4.写vue代码
<!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>vue初体验</title>
</head>
<body>
<div id="app">
<h1>vue的例子</h1>
<!-- 3. 双大括号表示插值表达式,在大括号中填写data的属性名 -->
<p>{{msg}}</p>
</div>
<!-- 1.引入本地下载的vue文件 -->
<script src="./vue.js"></script>
<script>
Vue.config.productionTip = false // 关闭生产提示
const vm = new Vue({
// 2. el 就是element的缩写 表示页面元素 表示 Vue对象控制的范围
el: '#app',
// data就是数据模型
data: {
//相当于是model 数据模型
msg: 'hello',
},
})
</script>
</body>
</html>
5.在谷歌浏览器启动开发者模式,引入vue拓展程序

运行自己写的vue代码 打开控制台看看是否有vue

ok 基本的使用已经成功 ^_^
Vue 安装 vue的基本使用 vue的初步使用步骤的更多相关文章
- [Vue安装教程]十分钟学会vue 安装
Vue的安装主要有一下几个步骤: 1.安装npm淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 2.安装脚手架工 ...
- Vue安装依赖npm install时报错问题解决方法
1.vue的安装依赖于node.js,要确保你的计算机上已安装过node.js. 可进入cmd编辑器,输入命令 node -v进行查看.出现版本信息即成功!没有则从浏览器上面下载安装即可,没有安 ...
- 前端笔记之Vue(一)初识SPA和Vue&webpack配置和vue安装&指令
一.单页面应用(SPA) 1.1 C/S到B/S页面架构的转变 C/S:客户端/服务器(Client/Server)架构的软件. C/S 软件的特点: ① 从window桌面双击打开 ② 更新的时候会 ...
- VUE 安装&创建一个项目
1,安装node.js vue依赖nodejs,所以首先要安装node.js 然后打开cmd,输入命令, node -v.正常出现版本号,说明你已经安装成功了 下载地址:http://nodejs.c ...
- 安装vue脚手架和vue安装element-ui
首先下载安装node.js,因为vue依赖node.js,然后用npm安装vue,步骤如下: 安装成功后安装element-UI,步骤如下: 完成后用npm run dev 运行项目.
- vue安装教程总结
转载:https://blog.csdn.net/sunny1660/article/details/78326548 简介: vue.js是一套构建用户界面的渐进式框架.比较简洁,用于解 ...
- vue 安装之路
vue 来源 1.安装node.js(http://www.runoob.com/nodejs/nodejs-install-setup.html) 2.基于node.js,利用淘宝npm镜像安装相关 ...
- vue 安装cli3.0版本,创建项目
注意:Vue CLI需要Node.js版本8.9或更高版本(建议使用8.11.0+). 查看node版本:node -v , 查看npm 版本 npm -v, 1.首先需要安装node.js环境 ...
- vue安装搭建
title: vue安装搭建 date: 2018-04-21 14:00:03 tags: [vue] --- 安装 首先安装nodejs 直接官网下载最新版本http://nodejs.cn/do ...
- vue安装及axios、stylus、iview的安装流程整理
现在做的项目中主要用到以下几个安装包,所以整理下流程: 使用命令行工具npm新创建一个vue项目 vue中axios的安装和使用 在vue项目中stylus的安装及使用 如何在vue中全局引入styl ...
随机推荐
- pt-osc又又出现死锁了
今天使用pt-osc修改mysql表结构,又出现死锁了,老大让尽量解决这个问题,我们先分析一下pt-osc容易出现死锁的原因,再来解决这个问题. 根据pt-osc打印的日志,可以看到pt-osc执行原 ...
- 超详细讲解H5移动端适配
前言 移动互联网发展至今,各种移动设备应运而生,但它们的物理分辨率可以说是五花八门,一般情况UI会为我们提供375尺寸的设计稿,所以为了让H5页面能够在这些不同的设备上尽量表现的一致,前端工程师就不得 ...
- Docker安装Opensips2.4实现内网sip电话通讯
使用说明 这是基于官方opensips 2.4镜像添加了mysql模块以及rest_client模块制作的镜像,用此镜像可以连接mysql控制opensip注册用户.查看通话记录以及通话时对INVIT ...
- centos下安装ansible自动化工具(超详细,包含基本使用)
ansible官网:https://www.ansible.com 众所周知,ansible是新出现的自动化运维工具,基于Python开发,集合了众多运维工具(puppet.cfengine.chef ...
- vue动态路由实现原理 addRoute
vue新版router.addRoute基础用法 新版Vue Router中用router.addRoute来替代原有的router.addRoutes来动态添加路由.子路由 在添加子路由的时候 比如 ...
- 二次封装这几个 element-ui 组件后,大大减少了我 CRUD 的时间
element-ui 因其组件丰富.可拓展性强.文档详细等优点成为 Vue 最火的第三方 UI 框架.element-ui 其本身就针对后台系统设计了很多实用的组件,基本上满足了平时的开发需求. 既然 ...
- .NET性能优化-你应该为集合类型设置初始大小
前言 计划开一个新的系列,来讲一讲在工作中经常用到的性能优化手段.思路和如何发现性能瓶颈,后续有时间的话应该会整理一系列的博文出来. 今天要谈的一个性能优化的Tips是一个老生常谈的点,但是也是很多人 ...
- 干货 | LVM快照学习
一个执着于技术的公众号 前言 在上一章节,我们学习了LVM逻辑卷管理技术,知道了LVM能够通过增减PE的数量来弹性调整文件系统的大小.除此之外,LVM还有另一个重要功能「LVM快照技术」,也就是可以给 ...
- brew常用命令
Homebrew 常用命令 brew -help # 查看帮助命令 brew config # 查看配置信息 brew list # 查看已安装软件包列表 brew cleanup # 清理所有包的旧 ...
- 1.还不会部署高可用的kubernetes集群?看我手把手教你使用二进制部署v1.23.6的K8S集群实践(上)
公众号关注「WeiyiGeek」 设为「特别关注」,每天带你玩转网络安全运维.应用开发.物联网IOT学习! 本章目录: 0x00 前言简述 0x01 环境准备 主机规划 软件版本 网络规划 0x02 ...