前言:这是第一次写博客,不由得有点小紧张,发出去可能也没有人看,当是激励一下自己,认真学习,天天向上!这篇笔记已经存了好久了,至今都还没有更到技术博客里,今天偷闲,把笔记重新整理一下.如果你也是刚开始学习vue,一定也是查找怎么安装,用什么编辑器之内的问题,那也许我可以帮助到你(亲自安装过程).
安装Vue可以使用NPM方法.
若没有npm,那就要安装一下了.以下是安装npm操作步骤:
1.安装Node.js
需要使用npm安装,若未安装npm,可操作以下操作:
首先从Node.js官网下载对应平台的安装程序，网速慢的童鞋请移步国内镜像。在windows上安装时务必选择全部组件,勾选Add to path.安装完成后，在Windows环境下，请打开命令提示符(在搜索程序与文件中输入cmd)，然后输入node -v，如果安装正常，你应该看到v7.6.0这样的输出：
C:\Users\IEUser>node -v
v7.6.0
继续在命令提示符输入node，此刻你将进入Node.js的交互环境。在交互环境下，你可以输入任意JavaScript语句，例如100+200，回车后将得到输出结果。
备注:要退出Node.js环境，连按两次Ctrl+C。
2.npm
npm在Node.js安装时顺带装好了.我们在命令提示符或者终端输入npm -v，应该看到类似的输出：
C:\>npm -v 4.1.2
安装vue
由于npm安装速度慢,所以使用淘宝镜像及其命令cnpm.
淘宝 NPM 镜像是一个完整 npmjs.org 镜像，你可以用此代替官方版本(只读)，同步频率目前为 10分钟 一次以保证尽量与官方服务同步。
你可以使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm:
npm install -g cnpm --registry=https://registry.npm.taobao.org
这样就可以使用 cnpm 命令来安装模块了：
cnpm install [name]
npm 版本需要大于 3.0，如果低于此版本需要升级它：
# 查看版本
$ npm -v
2.3.0
#升级
npm cnpm install npm -g
在用 Vue.js 构建大型应用时推荐使用 NPM 安装：
# 最新稳定版
$ cnpm install vue
命令工具
Vue.Js 提供一个官方命令行工具，可用于快速搭建大型单页应用。
# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置，默认回车即可
This will install Vue 2.x version of the template.
For Vue 1.x use: vue init webpack#1.0 my-project
? Project name my-project ? Project description A Vue.js project
? Author runoob <[email protected]>
? Vue build standalone
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? Yes
vue-cli · Generated "my-project".
To get started:
cd my-project npm install npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack
进入项目，安装并运行：
$ cd my-project
$ cnpm install
$ cnpm run dev
DONE Compiled successfully in 4388ms
> Listening at http://localhost:8080
成功执行以上命令后访问 http://localhost:8080/，输出结果如下所示：
以上便可以正确安装Vue了.
Sublime Text3
在官网上下载Sublime Text3,但可能用Sublime Text3打开vue项目文件的话,可能看上去一片白,若Sublime Text3支持Vue高亮显示的话,就容易编辑了.
让Sublime Text3支持Vue语法高亮显示
-
准备语法高亮插件vue-syntax-highlight。https://github.com/vuejs/vue-syntax-highlight
-
下载页面并下载：
解开压缩包vue-syntax-highlight-master，其内所有文件备用。
3.将vue-syntax-highlight植入sbulime。进入sublime，选择菜单项“Preferences->Browse Packages...”。
在打开的文件夹中创建“Vue”文件夹。
在Vue文件夹中，将vue-syntax-highlight-master压缩包解压后的所有文件考入。
4.sublime载入vue-syntax-highlight插件按下快捷键“ctrl+shift+p”，在打开的packages输入框中输入vue，选择“Set Syntax:Vue Component”进行加载。
加载后重启sublime，重新打开.vue文件，即能看到语法高亮。