VUE 安装&创建一个项目
1,安装node.js
vue依赖nodejs,所以首先要安装node.js
然后打开cmd,输入命令, node -v。正常出现版本号,说明你已经安装成功了
下载地址:http://nodejs.cn/download/
2,npm(cnpm)
npm是node的包管理工具
使用node之后你会接触各种各样成千上万的Package(包),就需要一个管理工具能很好的解决它的安装,更新,依赖包安装等等的维护。默认安装完node之后,npm会自动安装上的。还是cmd,输入命令 npm -V 。正常出现版本号,就可以了
由于有些npm有些资源被屏蔽或者是国外资源的原因,经常会导致用npm安装依赖包的时候失败,使用国内镜像cnpm,可以解决这个问题
npm install -g cnpm --registry=https://registry.npm.taobao.org
3,安装 vue.js
vue-cli是一种全局脚手架用于帮助搭建所需的模板框架
cnpm install -g vue-cli
npm强制清除缓存
cnpm cache clean —force
4,打开要创建的项目路径目录,创建项目
// 生成一个基于 webpack 模板的新项目 vue init webpack 项目名 或者 vue init webpack-simple 项目名
注意:vue init webpack-simple的项目默认打包后之后一个html和一个js文件,而vue init webpack项目默认打包完之后,会有很标准的目录
然后CD到项目名
//安装路由
cnpm install vue-router --save
//安装jquery
cnpm install jquery --save
// 启动开发服务器 ctrl+c 停止服务
cnpm run dev
这样,vue的项目就搭建成功了
有时起服务的时候会报错,可以补全包 cnpm install
**项目的三个目录:
文件夹1(src),主开发目录,要开发的单文件组件全部在这个目录下
文件夹2(static),静态资源目录,所有的css,js文件放在这个文件夹
文件夹3(dist),项目打包发布文件夹,最后要上线单文件项目文件都在这个文件夹中
还有node_modules目录是node的包目录,config是配置目录,build是项目打包时依赖的目录
VUE 安装&创建一个项目的更多相关文章
- Vue Create 创建一个新项目 命令行创建和视图创建
Vue Create 创建一个新项目 命令行创建和视图创建 开始之前 你可以先 >>:cd desktop[将安装目录切换到桌面] >>:vue -V :Vue CLI 3.0 ...
- Vue.js+vue-element搭建属于自己的后台管理模板:创建一个项目(四)
Vue.js+vue-element搭建属于自己的后台管理模板:创建一个项目(四) 前言 本章主要讲解通过Vue CLI 脚手架构建工具创建一个项目,在学习Vue CLI之前我们需要先了解下webpa ...
- vue cli创建typescript项目
使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...
- cordova安装--创建ionic项目
1.简介ionic ionic 是一个强大的 HTML5 应用程序开发框架(HTML5 Hybrid Mobile App Framework ). 可以帮助您使用 Web 技术,比如 HTML.CS ...
- kraken-ejs创建一个项目【学习札记】
Keep in Touch. 保持联络. Who’s calling? 是哪一位? You did right. 你做得对. You set me up! 你出卖我! kraken-express-e ...
- Ionic-wechat项目边开发边学(一):环境搭建和创建一个项目
之前学AngularJS,教程过了一遍觉得很简单,但真正写几个Demo就错误百出,一个小小的功能要折腾很久.所以这次学Ionic,准备以开发一个项目为切入点去学,那么问题来了,开发什么项目呢? 纠结了 ...
- Cordova之如何用命令行创建一个项目(完整示例)
原文:Cordova之如何用命令行创建一个项目(完整示例) 1. 创建cordova项目 (注意:当第一次创建或编译项目的时候,可能系统会自动下载一些东西,需要一些时间.) 在某个目录下创建cordo ...
- Gitlab创建一个项目
1.安装git yum install git 2.生成密钥文件:使用ssh-keygen生成密钥文件.ssh/id_rsa.pub ssh-keygen 执行过程中输入密码,以及确认密码,并可设置密 ...
- 用vue脚手架创建bootstrap-vue项目
用vue脚手架创建bootstrap-vue项目 框架的地址:https://bootstrap-vue.js.org/docs/ 第一步 vue init webpack demo第二步 cd de ...
随机推荐
- C#基础零碎知识点摘录
1.类分为静态类个非静态类(实例类) 静态类不能创建对象,使用方法时,直接类名.方法名(),常用的静态类有Console类 实例类:创建对象时通过对象调用类的方法 2.当我们声明一个类成员为静态时,意 ...
- 【原创】大叔经验分享(12)如何程序化kill提交到spark thrift上的sql
spark 2.1.1 hive正在执行中的sql可以很容易的中止,因为可以从console输出中拿到当前在yarn上的application id,然后就可以kill任务, WARNING: Hiv ...
- CentOS7.X首次安装docker无法启动的问题解决
CentOS7.2 随着Docker的不断流行与发展,docker公司(或称为组织)也开启了商业化之路,Docker 从 17.03版本之后分为 CE(Community Edition) 和 EE( ...
- SpringBoot 多数据源分布式事务
1.pom依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId> ...
- springboot集成mybatis源码分析-启动加载mybatis过程(二)
1.springboot项目最核心的就是自动加载配置,该功能则依赖的是一个注解@SpringBootApplication中的@EnableAutoConfiguration 2.EnableAuto ...
- linux无法联网使用yum提示cannot find a valid baseurl for repobase7x86_64
每次安装新镜像时会遇到物理机有网络新安装的linux中却无法与物理机通信(不能连网),只能玩一些预装功能.命令,无法使用各种常用工具(特别是MINI版连ifconfig都没有o(╥﹏╥)o),下面记录 ...
- thinkPHP中M()和D()的区别
在实例化的过程中,经常使用D方法和M方法,这两个方法的区别在于M方法实例化模型无需用户为每个数据表定义模型类,如果D方法没有找到定义的模型类,则会自动调用M方法.通俗一点说:M实例化参数是数据库的表名 ...
- js属性对象的hasOwnProperty方法
Object的hasOwnProperty()方法返回一个布尔值,判断对象是否包含特定的自身(非继承)属性. 判断自身属性是否存在 var o = new Object(); o.prop = 'ex ...
- String Formatting in C#
原文地址 http://blog.stevex.net/string-formatting-in-csharp/ When I started working with the .NET framew ...
- MSB4064 错误
把项目从vs2008转成vs 2012 后,受用msbuild 编译出错 错误Code:MSB4064 修改 把msbuild 的路径从 %windir%\Microsoft.NET\Framewor ...