1.安装node.js(http://www.runoob.com/nodejs/nodejs-install-setup.html)

2.基于node.js,利用淘宝npm镜像安装相关依赖

在cmd里直接输入:npm install -g cnpm --registry=https://registry.npm.taobao.org,回车,等待安装...

3.安装全局vue-cli脚手架,用于帮助搭建所需的模板框架

在cmd里 1)输入:cnpm install -g vue-cli,回车,等待安装...

2).输入:vue,回车,若出现vue信息说明表示成功

4.创建项目

在cmd里输入:vue init webpack vue_test(项目文件夹名),回车,等待一小会儿,依次出现‘git’下的项,可按下图操作

5.安装依赖

在cmd里  1).输入:cd vue_test(项目名),回车,进入到具体项目文件夹

2).输入:npm install,回车,等待一小会儿

回到项目文件夹,会发现项目结构里,多了一个node_modules文件夹(该文件里的内容就是之前安装的依赖)

基于脚手架创建的默认项目结构如下图所示:

6.测试环境是否搭建成功

方法1:在cmd里输入:npm run dev

方法2:在浏览里输入:localhost:8080(默认端口为8080)

运行起来后的效果如下图所示:

问题:

在安装过程中,你可能会遇到这个问题.

当我们运行某个项目是 会提示

> my-first-vue-project@1.0.0 dev C:\Users\ASUS\my-project
> node build/dev-server.js To use this template, you must update following to modules: npm: 2.15.9 should be >= 3.0.0

这是只有升级npm

即是 :使用 npm -g install npm@3.0.0 (版本号2.9.1 可以根据已发布的版本随意升级或降级),获取最新版本的npm 文件

查看版本:

这时在项目中进行  npm run dev 时还是会 提示

因此还有一部关键的一步:

复制C:\Users\{你的Windows用户名}\AppData\Roaming\npm\node_modules\npm下的文件到你的 NodeJS安装目录下的 \node_modules\npm 中,覆盖掉原有的全部文件

最后运行  npm run  dev 成功运行

vue 安装教程(自己安装过程及遇到的一些坑)的更多相关文章

  1. LLVM 安装教程(包安装)

    LLVM 安装教程 环境:ubuntu16.04  llvm-4.0 clang-4.0 步骤: 1.依赖库安装 $ sudo apt-get install build-essential curl ...

  2. mysql安装教程,mysql安装配置教程

    MySQL的安装教程 一.MYSQL的安装 首先登入官网下载mysql的安装包,官网地址:https://dev.mysql.com/downloads/mysql/ 一般下载这个就好,现在的最新版本 ...

  3. npm——安装教程、安装vue脚手架

    npm:是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题.比如常用的有: 1)允许用户从NPM服务器下载别人编写的第三方包到本地使用. 2)允许用户从NPM服务器下载并安 ...

  4. Kafka安装教程(详细过程)

    安装前期准备: 1,准备三个节点(根据自己需求决定) 2,三个节点上安装好zookeeper(也可以使用kafka自带的zookeeper) 3,关闭防火墙 chkconfig  iptables o ...

  5. MySQL安装教程&Navicat安装

    一.下载MySQL http://jingyan.baidu.com/article/e3c78d64412ae83c4c85f5fd.html 首先打开MySQL官网,找到Downloads标签,点 ...

  6. Redis安装教程及安装报错解决方案(大佬勿喷)

    安装环境:CentOS7 Redis版本:redis-6.0.9.tar.gz 依次按照以下顺序执行: 1. [root@localhost ~]# wget https://download.red ...

  7. Win10+Anaconda+tensorflow-cpu安装教程

    基础概念 Python2.x or Python3.x 自从20世纪90年代初Python语言诞生至今,一直在迭代更新,根据出现的时期,可以分为Python2.x和Python3.x两个大版本.其中P ...

  8. MySQL8.0.20安装教程,MySQL8.0.20安装详细图文教程

    1.下载链接如下: MySQL8.0.20版本 https://dev.mysql.com/doc/relnotes/mysql/8.0/en/news-8-0-20.html 其他版本:MySQL8 ...

  9. centos 6.X minimal 系列最小化安装完成后,安装mono和jexus过程小记录

    在使用虚拟机安装minimal版centos运行mono+jexus的时候,遇到了一些坑,记录一下,比如虚拟机访问不了网络,没wget命令没开放80端口,等等小问题,其他网上教程已经有mono+jex ...

  10. LNMP编译安装教程

    LNMP编译安装教程 此次安装在Centos上,我采用的CentOS的版本是:CentOS release 6.5 (Final) 可以通过以下命令查看:lsb_release -a 一.准备工作: ...

随机推荐

  1. 用webstorm来开发微信小程序之less的配置

    1.安装less. 安装好node之后,打开运行-->cmd-->进入安装node的文件夹目录-->输入 npm install -g less. 然后自动就会在C:\Users\A ...

  2. H5新特性之canvas

    canvas无疑是H5之中最受欢迎的新特性了,它可以让浏览毫无费力的画出各种图案,动画. canvas的性能不会因为画布上的图案多少而改变,因此做动画用canvas性能也相当优秀. canvas最基本 ...

  3. VBScript常用函数

    VBScript常用函数 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 1.Abs函数 Option Explicit '@author :yinzhengjie 'blog:ht ...

  4. free命令常用参数详解

    free命令常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在运维期间我们会经常去查看服务器硬件信息,比如说内存,大家可能知道看内存用“[root@yinzhengji ...

  5. 深入分析HashMap

    本文基于jdk1.8 HashMap特点: HashMap具体方法分析: put方法分析: 执行流程图: public V put(K key, V value) { return putVal(ha ...

  6. JAVA记录-JSP页面获取服务器路径方式

    1.basePath方式 <% String path = request.getContextPath(); String basePath = request.getScheme()+&qu ...

  7. Git fetch & pull

    转:https://blog.csdn.net/qq_36113598/article/details/78906882 1.简单概括 先用一张图来理一下git fetch和git pull的概念: ...

  8. js 布局转换问题

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 发现一sonar-runner bug

    最近在使用sonar-runner做代码扫描, 在windows环境运行多模块的扫描ok,但是在linux上sonar-runner扫描多模块报错: 先贴sonar-project.propertie ...

  10. python作业简单FTP(第七周)

    作业需求: 1. 用户登陆 2. 上传/下载文件 3. 不同用户家目录不同 4. 查看当前目录下文件 5. 充分使用面向对象知识 思路分析: 1.用户登陆保存文件对比用户名密码. 2.上传用json序 ...