在前一章基础上开发。

1、下载vue.js。(https://cn.vuejs.org/v2/guide/installation.html)

在hello-vue根目录下创建js文件夹,并将该vue.js放入。

2、新建index2.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" >
<title>第一个vue项目</title>
<script src="js/vue.js"></script>
</head>
<body>
<div id="app">
<!-- 模板,用于展示数据 -->
{{msg}}
</div>
<script>
new Vue({
el:"#app",
data() {
return {
msg:"hello 遥远2!"
}
},
})
</script>
</body>
</html>

完整结构

最后,运行任务

vue(4)hello world的更多相关文章

  1. 一步一步学习Vue(六)

    本篇继续介绍vue-router,我们需要要完成这样个demo:<分页显示文章列表>:这里我们以博客园首页列表为例简化处理: 按照上图框选所示,简单分为蓝色部分文章组件(ArticleIt ...

  2. 一步一步学习Vue(十一)

    本篇继续学习vuex,还是以实例为主:我们以一步一步学Vue(四)中讲述的例子为基础,对其改造,基于vuex重构一遍,这是原始的代码: todolist.js ; (function () { var ...

  3. vue(9)—— 组件化开发 - webpack(3)

    前面两个终于把webpack相关配置解析完了.现在终于进入vue的开发了 vue组件化开发预热 前期准备 创建如下项目: app.js: footer.js: main.js: webpack.con ...

  4. vue(8)—— 组件化开发 - webpack(2)

    webpack的常用loder和插件 loder和插件是什么,现在暂且不表,看到后面你就懂了 引入css问题 直接用link标签导入css 在前面的 vue(7)—— 组件化开发 — webpack( ...

  5. vue(2)—— vue简单语法运用,常用指令集

    按照前面的文章:vue(1)——node.js安装使用,利用npm安装vue  安装完vue之后,就可以使用vue了 vue vue简介 前面安装好vue之后,确实还没有对vue进行介绍,首先,官网: ...

  6. 一步一步学Vue(六)

    本篇继续介绍vue-router,我们需要要完成这样个demo:<分页显示文章列表>:这里我们以博客园首页列表为例简化处理: 按照上图框选所示,简单分为蓝色部分文章组件(ArticleIt ...

  7. 下载vuejs,Hello Vue(vscode)

    下载vuejs,Hello Vue(vscode) Hello Vue 下载使用vue.js 动图演示 Vue的基本使用步骤  传送门:https://cn.vuejs.org/v2/guide/in ...

  8. 一步一步学Vue(九) 路由元数据

    一步一步学Vue(九):https://www.cnblogs.com/Johnzhang/p/7260888.html

  9. 一步一步学Vue(六)https://www.cnblogs.com/Johnzhang/p/7242640.html

    一步一步学Vue(六):https://www.cnblogs.com/Johnzhang/p/7237065.html  路由 一步一步学Vue(七):https://www.cnblogs.com ...

  10. vue(element)中使用codemirror实现代码高亮,代码补全,版本差异对比

    vue(element)中使用codemirror实现代码高亮,代码补全,版本差异对比 使用的是vue语言,用element的组件,要做一个在线编辑代码,要求输入代码内容,可以进行高亮展示,可以切换各 ...

随机推荐

  1. Codeforces 464E The Classic Problem (最短路 + 主席树 + hash)

    题意及思路 这个题加深了我对主席树的理解,是个好题.每次更新某个点的距离时,是以之前对这个点的插入操作形成的线段树为基础,在O(logn)的时间中造出了一颗新的线段树,相比直接创建n颗线段树更省时间. ...

  2. 获取当前设备的CPU个数

    public class Test { public static void main(String[] args) { //获取当前设备的CPU个数 int availableProcessors ...

  3. 设置 PyCharm 软件中 Terminal 窗口 中启动的 python 交互命令的版本

    设置 PyCharm 软件中 Terminal 窗口 中启动的 python 交互命令的版本 python2 和 python3 有很大的不同,使用python2 编写的程序,如果使用python3 ...

  4. wpf 窗口打开后默认设置控件焦点

    https://blog.csdn.net/Vblegend_2013/article/details/81771872 <Grid FocusManager.FocusedElement=&q ...

  5. Python沙盒环境配置

    一.简介 本文介绍配置python沙盒环境的方法步骤. 二.安装步骤 1.安装pyenv http://www.cnblogs.com/274914765qq/p/4948530.html 2.安装v ...

  6. DIY的RPM包怎么签名呢 - 笔记

    参考 https://gist.github.com/fernandoaleman/1376720 如果打不开上一个连接,请参考https://www.cnblogs.com/LiuYanYGZ/p/ ...

  7. 【IMOOC学习笔记】多种多样的App主界面Tab实现方法(三)

    FragmentPagerAdapter+ViewPager 与之前直接用ViewPager不同的是,数组里面放的不再是View,而是Fraagment; 使用FragmentPagerAdapter ...

  8. Head First HTML与CSS(第2版) 中文pdf扫描版​

    是不是已经厌倦了那些深奥的HTML书?你可能在抱怨,只有成为专家之后才能读懂那些书.那么,找一本新修订的<Head First HTML与CSS(第2版)>吧,来真正学习HTML.你可能希 ...

  9. wpf跳转网页

    如果是本地磁盘上的网页,可以考虑利用操作系统的文件关联自动调用操作系统默认浏览器: System.Diagnostics.Process.Start("explorer.exe", ...

  10. charles 抓取app https 请求

    测试需要抓取app的https请求链接,百度了一下教程,能设置的都设置成功了,但就是抓取不成功,显示如下图 无奈之下还是用谷歌搜索了下(网速极慢),但是庆幸的找到了问题的答案,原因还是手机设置的问 打 ...