#我的VUE框架学习

题记:初识VUE,觉得VUE十分的不错,故决定去深入的了解学习它,工欲善其事,必先利其器,下面是我搭建vue环境的过程!

#一.项目搭建及初始化

1.安装:node.js;去官网下载:https://nodejs.org/en/

2.安装cnp:mnpm install -g cnpm --registry=https://registry.npm.taobao.org

安装后打开cmd控制台,由于npm的源在国外,我们利用国内镜像去使用

3.全局安装webpack:cnpm install webpack -g

细心可以看到不再是npm了,改为cnpm了,这就是国内镜像去下载的,运行vue还需要webpack去在本地服务器上运行

4.安装webpack-cli:cnpm install -g webpack-cli

因为CLI(命令行工具)转移到了包webpack-cli中所以我们还需要去安装一下webpack-cli

5.安装vue-cli:cnpm install -g vue-cli

首先vue-cli 是vue.js的脚手架,用于自动生成vue.js+webpack的项目模板

6.初始化项目:vue init webpack (此处为你的项目名称)

全部弄好了,开始初始化项目了

这里我把项目放在H盘了,执行命令可以看到成功了,(乱码不用管,不影响)并且开始问你:

1、项目名称了。2、项目描述。3、作者。4、是否安装vue-router。5、是否使用ESLint来编写代码。6、是否建立单元测试。7、也是问你是否建立测试。8、问你我们是否应该在项目创建后为您运行“npm install”?(推荐)(npm install安装依赖)。这里笔者都选择了NO。

7.进入项目:cd 你的项目名称,去安装依赖。

8.安装依赖:cnpm install

6.启动项目:npm run dev

安装完依赖后就可以使用命令跑起来了,注意默认是8080端口

以上就是我的vue脚手架搭建了,希望能给大家带来帮助,如有用词不妥欢迎指出,谢谢!

VUE框架学习——脚手架的搭建的更多相关文章

  1. vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)

    第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...

  2. Vue框架简介和环境搭建

    前言: 此篇随笔为个人学习前端框架Vue,js的技术笔记,主要记录一些自己在学习Vue框架的心得体会和技术总结,作为回顾和笔记使用. 这种写博客的方式,对刚开始学习Vue框架的我,也是一种激励,我相信 ...

  3. vue框架(二)_vue环境搭建及创建项目

    1.node.js:概念介绍及安装 node.js:是一个基于chrome浏览器的v8引擎,可以运行javascript的环境(平台) 特性:异步IO模型 npm:是一个包管理器(工具),可以按装依赖 ...

  4. vue框架学习笔记(vue入门篇)

    vue框架 - 构建用户界面的渐进式框架 - 采用自底层向上增量开发的设计 - 核心库只关注视图层 - 当与单文件组件和vue生态系统支持的库结合使用时,也完全能够为复杂的单页应用程序提供驱动 - v ...

  5. Vue基础及脚手架环境搭建

    From:http://www.jianshu.com/p/dc5057e7ad0d 一.vue基础 “Vue2.0”跟俺一起全面入坑 01 “Vue2.0”跟俺一起全面入坑 02 “Vue2.0”跟 ...

  6. Vue.js学习笔记--菜鸟搭建一个企业级vue的项目

    vue.js新手搭建一个企业项目,从0开始 前置条件: node.npm请先安装配置好 下面开始: npm 下载vue-cli脚手架工具  确认安装成功看到版本号: 初始化项目,选用webpack(p ...

  7. vue环境配置脚手架环境搭建vue工程目录

    首先在初始化一个vue项目之前,我们需要下载node.js,并且安装! 下载地址: nodejs.cn/download 安装完成之后,windows+r 运行命令 cmd  输入node -v  检 ...

  8. vue框架之脚手架(vue-cli)的使用

    前期准备 1.在使用之前需要安装node.js,https://nodejs.org/dist/latest-v8.x/ 2.下载之后在cmd中测试 node -v npm -v 如图上即可 3.下载 ...

  9. vue框架-学习记录

    前段时间在做vue项目时,遇到挺多问题,想简单总结一下: 1.关于父组件,子组件的通信 网上有很多这方面的讲解,讲解也比较细致,我主要总结了自己在项目中需要的: [1]父组件-子组件 也就是" ...

随机推荐

  1. 亿财道APP赚钱攻略,亿财道,一个看广告年入36万的APP

            亿财道(http://etway.net/),一款看广告(传单)赚钱的软件,这是一项革新的广告产品,代替了以往的纸质传单.在商家节约成本的同时,还给阅读者佣金,推广也有相应提成比例. ...

  2. shell-3.bash的基本功能:多命令顺序执行与管道符

    1. 2.

  3. 模块 –OS & OS.PATH

    模块-Os模块: os.getcwd() 获取当前工作目录,即当前python脚本工作的目录路径 In [25]: os.getcwd() Out[25]: 'C:\\Users\\***' os.c ...

  4. Iterator(迭代器) 和generator

    数组是可迭代的 var a = []; console.dir(a); 发现这里有一个Symbol.iterator ,说明它是可迭代的. object 是不可以迭代的 var a = {} cons ...

  5. [codevs3269]混合背包

    题目大意:一道混合背包模板. 解题思路:分三种情况讨论,01和完全没什么问题,多重背包需要把物品分成$\log W[i]$件,然后01即可,分成W[i]件01会TLE. 读优大法好! C++ Code ...

  6. 紫书 习题 8-16 UVa 1618 (中途相遇法)

    暴力n的四次方, 然而可以用中途相遇法的思想, 分左边两个数和右边两个数来判断, 最后合起来判断. 一边是n平方logn, 合起来是n平方logn(枚举n平方, 二分logn) (1)两种比较方式是相 ...

  7. ActiveMQ学习总结(9)——Linux中安装ActiveMQ

    1.新建一个文件夹activeMQ   mkdir /server 2.授权    chmod 777 /server 3.下载activeMQ安装包,拷贝到/activeMQ目录下 apache-a ...

  8. ASP.NET-让html代码输出为字符串

    HttpUtility.HtmlEncode这个函数可以让s变成没有攻击的代码,可以提升网站的安全性 public string Index(string s = "suepr name i ...

  9. Caffe-python interface 学习|网络训练、部署、測试

    继续python接口的学习.剩下还有solver.deploy文件的生成和模型的測试. 网络训练 solver文件生成 事实上我认为用python生成solver并不如直接写个配置文件,它不像net配 ...

  10. android:为TextView加入样式——下划线,颜色,设置链接样式及前背景色

    实现下划线及颜色设置: public class AtActivity extends Activity { LinearLayout ll;     /** Called when the acti ...