通过JS引用vue就不说了,重点说一下使用npm搭建vue脚手架. (以下是windows系统下的操作,win7+)

    npm是个命令行工具,在搭建vue脚手架之前首先要安装nodeJS,下面是node的下载地址:

    https://nodejs.org/en/

    

    左边的8.11.3是我写博文这个时候的最稳定版本, 生产环境请下载这个,实验学习阶段随意。右边是当前最新版本。

    下载下来以后常规安装即可。

    


    http://doc.vue-js.com/v2/guide/installation.html

    根据这里的vue安装介绍,我们开始搭建vue脚手架了!

    安装最新稳定版vue  $ npm install vue,如已安装再次执行的时候则是更新操作,如下图,我安装过了所以提示更新了:

    

    (补一句,对于不写node仅是为了构建vue项目的我们来说,目前我们用不上node的那个命令框,安装node也只是为了一个npm命令的环境,安装vue的时候在dos里敲命令即可)

    安装完成以后执行 vue  --version 可以查看当前vue的版本。

    

    shell操作如下所示,全局安装vue-cli,接着创建一个基于webpack模板的新项目,cd的要存放的文件目录以后执行安装,最后运行即可。

    

     dos不动的时候,回车输y,表示安装附带的一些插件(也可以选n,后面需要时再安装,建议选y)

    

    dos下面不动了基本就表示安装完成。

    

    注意一下啊,上面还有一句cd my-project,意思是要先cd到项目跟目录,在执行npm run dev 运行项目,执行完以后会这样:

    

    浏览器打开后如图:

    (注意哈,上面的dos别关闭,这个时候关闭了项目就停止运行了!)

    

    以上,我们就完成了vue项目的脚手架的搭建。

    

    生成的目录结构是这样的。关于vue的更多讲解,未完待续.......

  

    

vue入门(一)的更多相关文章

  1. wepack+sass+vue 入门教程(三)

    十一.安装sass文件转换为css需要的相关依赖包 npm install --save-dev sass-loader style-loader css-loader loader的作用是辅助web ...

  2. wepack+sass+vue 入门教程(二)

    六.新建webpack配置文件 webpack.config.js 文件整体框架内容如下,后续会详细说明每个配置项的配置 webpack.config.js直接放在项目demo目录下 module.e ...

  3. wepack+sass+vue 入门教程(一)

    一.安装node.js node.js是基础,必须先安装.而且最新版的node.js,已经集成了npm. 下载地址 node安装,一路按默认即可. 二.全局安装webpack npm install ...

  4. vue入门学习(基础篇)

    vue入门学习总结: vue的一个组件包括三部分:template.style.script. vue的数据在data中定义使用. 数据渲染指令:v-text.v-html.{{}}. 隐藏未编译的标 ...

  5. VUE 入门笔记

    前端的MVVM概念今年来也算是如火如荼,了解完 MVVM的概念,也该找个去尝试下 首先我先试了下 国内小而美的 VUE 试着照着文档敲出入门文件,内容都在注释里 <!doctype html&g ...

  6. Vue 入门指南 JS

    Vue 入门指南 章节导航 英文:http://vuejs.org/guide/index.html 介绍 vue.js 是用来构建web应用接口的一个库 技术上,Vue.js 重点集中在MVVM模式 ...

  7. Vue学习记录第一篇——Vue入门基础

    前面的话 Vue中文文档写得很好,界面清爽,内容翔实.但文档毕竟不是教程,文档一上来出现了大量的新概念,对于新手而言,并不友好.个人还是比较喜欢类似于<JS高级程序设计>的风格,从浅入深, ...

  8. parcel+vue入门

    一.parcel简单使用 npm install -D parcel-bundler npm init -y (-y表示yes,跳过项目初始化提问阶段,直接生成package.json 文件.) Pa ...

  9. Vue入门基础

    前面的话 Vue中文文档写得很好,界面清爽,内容翔实.但文档毕竟不是教程,文档一上来出现了大量的新概念,对于新手而言,并不友好.个人还是比较喜欢类似于<JS高级程序设计>的风格,从浅入深, ...

  10. 学习Vue 入门到实战——学习笔记

    闲聊: 自从进了现在的公司,小颖就再没怎么接触vue了,最近不太忙,所以想再学习下vue,就看了看vue相关视频,顺便做个笔记嘻嘻. 视频地址:Vue 入门到实战1.Vue 入门到实战2 学习内容: ...

随机推荐

  1. Jenkins系统监测

    Jenkins 是一个开源项目,提供了一种易于使用的持续集成系统,使开发者从繁杂的集成中解脱出来,专注于更为重要的业务逻辑实现上.同时 Jenkins 能实施监控集成中存在的错误,提供详细的日志文件和 ...

  2. 【Linux基础】Linux常用命令汇总

    3-1文件目录操作命令(cd pwd mkdir rmdir rm) 绝对路径:由根目录(/)开始写起的文件名或目录名称, 例如 /home/dmtsai/.bashrc: 相对路径:相对于目前路径的 ...

  3. UEditor学习笔记1

    首先对于前段时间遇到的一些总结做下记录: 0 == ''  => true transition,渐变属性,其值可以是某属性,也可以是all,如transition: all 0.3s:鼠标放到 ...

  4. 修改CentOS默认yum源为国内yum镜像源

    CentOS默认的yum源不是国内的yum源,在通过yum安装一些软件的时候,会出现这样那样的错误,以及在下载安装的速度上也是非常慢的. 所以这个时候就需要将yum源替换成国内的yum源,国内主要开源 ...

  5. Python中的Numpy入门教程

    1.Numpy是什么 很简单,Numpy是Python的一个科学计算的库,提供了矩阵运算的功能,其一般与Scipy.matplotlib一起使用.其实,list已经提供了类似于矩阵的表示形式,不过nu ...

  6. YYModel HandyJson

    数学基础: 以类型集合空间为基础,多阶向量结构间的同构映射: 若两个数学结构之间存在同构映射,那么这两个结构叫做是同构的. 基于集合空间的映射: 原理: 1.根据类型名称获得类型的元信息: 2.根据映 ...

  7. ansible-playbook 进行批量安装tomcat8

    ansible-playbook 进行安装tomcat操作 说明: get_url  中下载的内容直接到目的主机 安装的时候需要指定copy: no,说明需直接从目标主机进行安装包 [root@ans ...

  8. P2690 接苹果 (DP)

    补一下dp的思路: dp[i][j]表示第 i 分钟转 j  次所得到的最大值.很容易得到这个dp的推导式. 图中¢()函数表示成立为1, 不成立为0的函数. #include<cmath> ...

  9. layui之确认框

    要使用layui的确认框,需要导入layui的两个库,分别为layer.js和layer.css,除此之外layui.js和layui.css的库也是要导入,这个请注意.所有说你需要分别导入四个库la ...

  10. Node.js读取某个目录下的所有文件夹名字并将其写入到json文件

    针对解决的问题是,有些时候我们需要读取某个文件并将其写入到对应的json文件(xml文件也行,不过目前用json很多,json是主流). 源码如下:index.js var fs = require( ...