#我的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. jqGrid冻结列

    jqgrid冻结列 冻结列:就是横向移动表格时,让某一列保持不动 做法: 1.colModel的行要加上属性: frozen:true.注意:冻结列必须从第一列开始,包括隐藏列 2.加载jqgrid后 ...

  2. bioinformaitcs的latex版本参考文献填坑

    最近实验室投bioinfomatics的刊,编辑说要把参考文献的格式改成不带方括号的,而且加点,而且只保留前三作者,之后用et al. 折腾了一下午,终于弄出来了. 首先,导言区需要添加: \make ...

  3. Codeforces 982 C. Cut 'em all!(dfs)

    解题思路: 代码中有详细注解,以任意一点为根,dfs遍历这棵树. 每一个节点可能有好几个子树,计算每棵子树含有的节点数,再+1即为这整棵树的节点. 判断子树是否能切断与根之间的联系,如果子树含有偶数个 ...

  4. 适配器模式(Adapter):类适配器、对象适配器

    适配器模式(Adapter):将一个类的接口转换成客户希望的另外一个接口.A d a p t e r 模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作. 适用场景: 1.已经存在的类的接口 ...

  5. Oracle查询当前用户下的所有表及sqlplus 设置 列宽

    如果oracle服务器中装有多个数据库实例,则在用户名处输入:用户名/密码@数据库名称.如果数据库服务器不在本机上,还需要加上数据库服务器的地址:用户名/密码@IP地址/数据库名称. [oracle@ ...

  6. hiho 172周 - 二维树状数组模板题

    题目链接 描述 You are given an N × N matrix. At the beginning every element is 0. Write a program supporti ...

  7. STM8S103之GPIO

    如何快速了解GPIO,查看Reference manual中GPIO章节,初步了解到GPIO GPIO输入分为:Floating Input和Input with pull-up GPIO输出分为:O ...

  8. shell基础编程

    首先要注意的是,Ubuntu里的shell的sh和bash命令是有区别的 如下所示,Ubuntu下的sh指向的dash程序,而bash是dash的增强版,一些bash上能执行的程序在dash上不行 如 ...

  9. 解决IIS服务器部署 字体图标找不到的原因

    引言 我们往往在IIS上部署Web项目,或者发布Web项目的时候,经常会遇到浏览器找不到字体文件(woff/woff2)产生的错误.这样会导致浏览器无法加载字体图标,在影响加载时间的同时,更无法显示对 ...

  10. 实战medusa暴力破解

     medusa介绍: 暴力破解工具:主要可以破解这些模块功能很强大 medusa  的安装 条件: 准备工作:(下载下面软件)   1 wget http://www.foofus.net/jmk/t ...