vue学习 - 配置安装+vue-cli Demo

前言

vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。

github：https://github.com/vuejs/vue

学习文档：http://www.runoob.com/vue2/vue-tutorial.html

编辑工具：https://code.visualstudio.com/Download 

安装配置

1. 安装node.js (mac推荐安装brwhome,使用brew命令安装)

brew install node

npm -v

dyld: Library not loaded: /usr/local/opt/icu4c/lib/libicui18n.58.dylib 报错解决：

brew uninstall –force node 
brew uninstall icu4c && brew install icu4c 
brew unlink icu4c && brew link icu4c –force 
brew install node


node -v 
v11.11.0

2.安装vue -cli 脚手架

npm install -g cnpm --registry=https://registry.npm.taobao.org //npm切换成cnpm
npm install -g vue       //全局安装vue
npm install -g webpack   //全局安装webpack
npm install -g vue-cli   //安装脚手架

3.打开终端构建项目vue init vue-test

4.运行项目

目录结构

切换到构建的项目里边执行

cd vue-test 
npm i //安装依赖
npm run dev // 运行

启动成功：访问http://localhost:8080/

 

5.打包项目

打开conf目录下的index.js 将"/"修改成"./"

执行打包命令npm run build

项目里生成dist文件，这个文件里边是已经编译好的网页和css，js

最后再执行npm run dev

 

搭建demo

 

搭建vue登录demo：https://www.jianshu.com/p/1210a281b40f