1.由于vue项目依赖 node.js npm 需要先安装.   若没有请先安装,请百度

//检查是否有node.js  npm vue

win+r   输入cmd  输入node -v  回车 会出现node,js的版本

输入npm -v  回车 会出现npm的版本

输入vue -V 回车 会出现vue的版本

2.安装vue:
  1. npm install -g vue-cli
  2. //-g表示全局安装,vue-cli是模块,全局安装的模块可以在命令行直接使用

由于npm网站在国内速度非常慢,所以可以在命令后面加上淘宝的镜像

即:npm install -g vue-cli --registry=https://registry.npm.taobao.org
 
之后,可以vue --V查看vue是否安装好,出现版本号即安装成功。
3.接下来是创建项目框架
如果想放到指定的目录下,先进入这个目录在执行创建项目的命令
例如:           e:回车   //进入E盘                              cd test回车   //进入E盘的test文件夹
E:\test\vue init webpack my-vue          //创建一个基于"webpack"的项目,后面是项目名 
依次按照提示输入,项目名、项目描述、项目作者等等,
然后一路回车  看到最后这句项目就创建好了。
To get started:  就是告诉你接下来该做什么,依次完成下面3行命令就可以了。进入my-vue项目-----安装npm依赖-----运行项目
 
 
以下为此3步的详解
 
cd my-vue   
在my-vue文件下看到项目结构:
注:这是安装了依赖以后的截图,没安装依赖以前是没有node_modules文件夹的

 
 
4.安装项目依赖
生成了项目以后是不能直接运行的,现在很多项目都依赖许许多多的模块,需要逐一安装依赖。
ctrl+c 停掉刚生成项目的命令,cd my-vue 进入项目跟目录, 用命令npm install 安装
若安装缓慢同样可以使用淘宝镜像
即输入命令:npm install --registry=https://registry.npm.taobao.org
当这个命令运行完成以后会多出一个node_modules文件夹,里面就是项目所需的所有依赖
可以看到有很多模块,这些模块都是在package.json文件里定义好了的.
 
5.运行测试
  1. npm run dev
出现如下红色框框表示启动完成,一般流览器会自动跳转出界面http://localhost:8080/,也可以手动打开流览器器输 入地址。

使用vue2.0创建的项目的步骤的更多相关文章

  1. 【数据售卖平台】—— Vue2.0入门学习项目爬坑

    前言:这个项目是我从零学习Vue2.0时用于练习基础知识的入门项目,包含了Vue2.0几乎所有项目都会用到的基础功能,是新手用来练手的好项目,这里温故知新对功能点做一个总结.github地址:http ...

  2. .Net Core .Net Core V1.0 创建MVC项目

    .Net Core V1.0 创建MVC项目 创建MVC项目有两种方式: 一.创建Web项目:(有太多没用的东西要去删太麻烦) 2.项目目录结构: 此种方法要注意的是,会创建好多个json文件,下面就 ...

  3. 前后端分离之vue2.0+webpack2 实战项目 -- webpack介绍

    webpack的一点介绍 Webpack 把任何一个文件都看成一个模块,模块间可以互相依赖(require or import),webpack 的功能是把相互依赖的文件打包在一起.webpack 本 ...

  4. 使用Vue-cli3.0创建的项目,如何发布npm包

    使用Vue-cli3.0创建的项目,如何发布npm包 在使用vue进行项目开发时,如果我们想要发布一个包,有时候会有点迷糊,不知道应该怎么修改脚手架的默认设置.这里记录一下一些常见的操作. 创建ind ...

  5. 【HANA系列】SAP ECLIPSE中创建ABAP项目的步骤

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP ECLIPSE中创建AB ...

  6. vue2.0 创建项目

    准备 安装淘宝 npm镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 添加系统变量path的内容 因为cnpm会被安 ...

  7. sass创建web项目环境步骤

    1)npm创建web前端项目环境步骤 1.新建文件夹,在该文件下进入cmd控制台2.输入命令 npm init 回车3.name:名字只支持小写,不支持大写,将大写的名字改为小写即可4.version ...

  8. Vue2+Webpack创建vue项目

    相比较AngularJS和ReactJS,VueJS一直以轻量级,易上手称道.MVVM的开发模式也使前端从原先的DOM中解放出来,我们在不需要在维护视图和数据的统一上花大量时间,只需要关注于data的 ...

  9. 使用SVN+Axure RP 8.0创建团队项目

    一.使用到的工具:VisualSVN Server --SVN服务器:https://www.visualsvn.com/server/ Axure RP 8.0  :http://www.downc ...

随机推荐

  1. c++ 如何开N次方?速解

    c++ 如何开N次方?速解   直接上代码 #include <iostream> #include <cmath> using namespace std; typedef ...

  2. sphinx的使用

    1.下载地址 http://sphinxsearch.com/downloads/release/ 2.将其解压到D:\sphinx,并在D:\sphinx下新建目录data(用来存放索引文件)与lo ...

  3. Java之JVM(初学者)

    学习Java的第一次总结 1.Java程序的编译和执行 通过上图,我们轻易得出java执行过程:由javac编译为字节码文件,通过JVM转换为底层操作系统可识别的命令操作. 注意:①Java跨平台的始 ...

  4. Arduino编程基础1.1

    Arduino编程语言是建立在C/C++语言基础上的,即以C/C++语言为基础,把AVR单片机(微控制器)相关的一些寄存器参数设置等进行函数化,以利于开发者更加快速地使用.其主要使用的函数包括数字I/ ...

  5. LeetCode 98. 验证二叉搜索树 | Python

    98. 验证二叉搜索树 题目来源:https://leetcode-cn.com/problems/validate-binary-search-tree 题目 给定一个二叉树,判断其是否是一个有效的 ...

  6. 使用 vi 命令创建一个cpp文件

    mkdir text //创建一个text的文件夹 cd text //打开text的文件夹 vi text.cpp //创建text.cpp 按住 i 键输入程序 输入后按esc,再按wq退出 ls ...

  7. vue省市区三级联动(高仿京东)

    该栗子是我直接从公司的项目单独拉出来的(懒得重新写一次了),所以代码会有些冗余,下面直接看效果: 接着上代码: html: <template> <div> <div c ...

  8. docker磁盘空间不足解决办法

    docker磁盘空间不足解决办法 导入docker镜像时,错误提示:磁盘空间不足. 1.查看docker镜像存放目录空间大小 du -hs /var/lib/docker/ 2.停止docker服务. ...

  9. Java中Error和Exception的异同以及运行时异常(Runtime exception)与检查型异常(checked exception)的区别

    一:Error和Exception的基本概念: 首先Exception和Error都是继承于Throwable 类,在 Java 中只有 Throwable 类型的实例才可以被抛出(throw)或者捕 ...

  10. 附018.K3S-ETCD高可用部署

    一 K3S概述 1.1 K3S介绍 K3S是一个轻量级Kubernetes发行版.易于安装,内存消耗低,所有二进制文件不到40mb. 适用于: 边缘计算-Edge 物联网-IoT CI ARM 1.2 ...