VUE框架学习——脚手架的搭建
#我的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框架学习——脚手架的搭建的更多相关文章
- vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)
第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...
- Vue框架简介和环境搭建
前言: 此篇随笔为个人学习前端框架Vue,js的技术笔记,主要记录一些自己在学习Vue框架的心得体会和技术总结,作为回顾和笔记使用. 这种写博客的方式,对刚开始学习Vue框架的我,也是一种激励,我相信 ...
- vue框架(二)_vue环境搭建及创建项目
1.node.js:概念介绍及安装 node.js:是一个基于chrome浏览器的v8引擎,可以运行javascript的环境(平台) 特性:异步IO模型 npm:是一个包管理器(工具),可以按装依赖 ...
- vue框架学习笔记(vue入门篇)
vue框架 - 构建用户界面的渐进式框架 - 采用自底层向上增量开发的设计 - 核心库只关注视图层 - 当与单文件组件和vue生态系统支持的库结合使用时,也完全能够为复杂的单页应用程序提供驱动 - v ...
- Vue基础及脚手架环境搭建
From:http://www.jianshu.com/p/dc5057e7ad0d 一.vue基础 “Vue2.0”跟俺一起全面入坑 01 “Vue2.0”跟俺一起全面入坑 02 “Vue2.0”跟 ...
- Vue.js学习笔记--菜鸟搭建一个企业级vue的项目
vue.js新手搭建一个企业项目,从0开始 前置条件: node.npm请先安装配置好 下面开始: npm 下载vue-cli脚手架工具 确认安装成功看到版本号: 初始化项目,选用webpack(p ...
- vue环境配置脚手架环境搭建vue工程目录
首先在初始化一个vue项目之前,我们需要下载node.js,并且安装! 下载地址: nodejs.cn/download 安装完成之后,windows+r 运行命令 cmd 输入node -v 检 ...
- vue框架之脚手架(vue-cli)的使用
前期准备 1.在使用之前需要安装node.js,https://nodejs.org/dist/latest-v8.x/ 2.下载之后在cmd中测试 node -v npm -v 如图上即可 3.下载 ...
- vue框架-学习记录
前段时间在做vue项目时,遇到挺多问题,想简单总结一下: 1.关于父组件,子组件的通信 网上有很多这方面的讲解,讲解也比较细致,我主要总结了自己在项目中需要的: [1]父组件-子组件 也就是" ...
随机推荐
- 亿财道APP赚钱攻略,亿财道,一个看广告年入36万的APP
亿财道(http://etway.net/),一款看广告(传单)赚钱的软件,这是一项革新的广告产品,代替了以往的纸质传单.在商家节约成本的同时,还给阅读者佣金,推广也有相应提成比例. ...
- shell-3.bash的基本功能:多命令顺序执行与管道符
1. 2.
- 模块 –OS & OS.PATH
模块-Os模块: os.getcwd() 获取当前工作目录,即当前python脚本工作的目录路径 In [25]: os.getcwd() Out[25]: 'C:\\Users\\***' os.c ...
- Iterator(迭代器) 和generator
数组是可迭代的 var a = []; console.dir(a); 发现这里有一个Symbol.iterator ,说明它是可迭代的. object 是不可以迭代的 var a = {} cons ...
- [codevs3269]混合背包
题目大意:一道混合背包模板. 解题思路:分三种情况讨论,01和完全没什么问题,多重背包需要把物品分成$\log W[i]$件,然后01即可,分成W[i]件01会TLE. 读优大法好! C++ Code ...
- 紫书 习题 8-16 UVa 1618 (中途相遇法)
暴力n的四次方, 然而可以用中途相遇法的思想, 分左边两个数和右边两个数来判断, 最后合起来判断. 一边是n平方logn, 合起来是n平方logn(枚举n平方, 二分logn) (1)两种比较方式是相 ...
- ActiveMQ学习总结(9)——Linux中安装ActiveMQ
1.新建一个文件夹activeMQ mkdir /server 2.授权 chmod 777 /server 3.下载activeMQ安装包,拷贝到/activeMQ目录下 apache-a ...
- ASP.NET-让html代码输出为字符串
HttpUtility.HtmlEncode这个函数可以让s变成没有攻击的代码,可以提升网站的安全性 public string Index(string s = "suepr name i ...
- Caffe-python interface 学习|网络训练、部署、測试
继续python接口的学习.剩下还有solver.deploy文件的生成和模型的測试. 网络训练 solver文件生成 事实上我认为用python生成solver并不如直接写个配置文件,它不像net配 ...
- android:为TextView加入样式——下划线,颜色,设置链接样式及前背景色
实现下划线及颜色设置: public class AtActivity extends Activity { LinearLayout ll; /** Called when the acti ...