上次使用vue+node搭建简易博客过程中，发现自己还有很多的问题需要学习，于是就有了这一系列关于vue的笔记。
vue的安装
一、 直接在页面使用<script>引入，vue会被注册为一个全局的变量。
二、 利用vue-cli搭建开发环境
准备：安装Node 、npm （查看node/npm的版本可以在命令行输入 node -v）
node下载地址：https://nodejs.org/en/download/
1
（1） node和npm安装成功后，继续安装vue-cli 在命令行输入（-g是全局安装）
npm install -g @vue/cli 安装新版本的vue-cli （3.x版本的）
npm uninstall vue-cli -g 旧版本的卸载用
安装成功之后使用 vue - -version 查看版本号
（2） 在vue-cli安装成功之后，开始创建项目（这里没有使用webpack搭建）
执行 vue create my-project
这里都是默认的，安装完成之后cd 进项目，使用 npm run serve 启动项目
启动完成后，下面有端口号，在浏览器打开，出现以下这样的图片就显示创建项目成 功。
至此，一个vue项目就搭建完成。
2 接下来在看vue-cli 2.x来搭建项目
（1） 安装vue-cli
npm install vue-cli -g 安装老1.x或2.x版本的
github地址：vue-cli2.x
(2) 用法
vue init < template-name > < project-name >
<template-name>：表示模板名称，vue-cli官方为我们提供了6种模板
webpack - 一个功能齐全的Webpack + vue-loader设置，具有热加载，linting，测试和 css扩展。（一般使用这个）
webpack-simple - 一个简单的Webpack + vue-loader设置。
browserify 一个全面的Browserify+vueify 的模板，功能包括热加载，linting,单元检测。
browserify -simple - 一个简单Browserify+vueify的模板，不包含其他功能，让你快速的 搭建vue的开发环境。
pwa - 基于webpack模板的vue-cli的PWA模板
simple - 一个最简单的单页应用模板。
（3） 安装成功之后，cd进项目
（4） 安装依赖 npm install
（5）npm run dev 来运行项目，出现和上图一样的界面，就表示一个vue项目就创建成功。
网友评论