Vue框架原理及简单应用(一)

前言


1、Vue.js 是一个JavaScriptMVVM库,是一套构建用户界面的渐进式框架


2、是以数据驱动和组件化的思想构建的,采用自底向上增量开发的设计


3、vue + vuex+ vue-resource + vue-router + webpack + es6 + less的项目架构成为了越来越多大公司的第一选择


一、创建vue项目


1、通过命令创建一个vue项目


vue create hello-world


Vue框架原理及简单应用(一)


npm install -g @vue/cli


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


创建好的目录结构


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)

2、通过ui页面方式创建一个项目


vue ui


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)

Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)

Vue框架原理及简单应用(一)

Vue框架原理及简单应用(一)

Vue框架原理及简单应用(一)


二、调试插件


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


启动vue项目的一个报错


npm run dev


Vue框架原理及简单应用(一)


报错说明是node版本问题


当前环境


Vue框架原理及简单应用(一)


brew search node


Vue框架原理及简单应用(一)


npm install -g n


sudo n 10.19.0


Vue框架原理及简单应用(一)


npm run dev


Vue框架原理及简单应用(一)


将node版本升级了之后 需要重新编译下sass


npm rebuild node-sass


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)


Vue框架原理及简单应用(一)

上一篇:centos6.0安装Postfix+dovecot+sasl+openwebmail+httpd+bind


下一篇:git命令梳理(三)