连接转载:https://www.cnblogs.com/Colwill-Blog/p/6682091.html

刚刚开始学习Vue.js。今天分享一下我的Vue项目安装过程。

我是windows系统,使用安装工具是NPM

一、Vue安装

1、检查是否已经安装了node和npm

  在命令窗口(windoes + R 键打开输入cmd确认)输入node -v 和npm -v,如果显示出版本号,说明安装成功

2、安装vue-cli

  在全局安装vue-cli 

npm install -g vue-cli

(这种方法安装较慢,可以使用国内淘宝镜像安装:npm install -g cnpm --registry=https://registry.npm.taobao.org/

  如果安装失败,可以使用 npm cache clean清理缓存,然后再重新安装。

输入cnpm -v 查看是否安装成功,输入cnpm install -g vue-cli 安装vue-cli和webpack )

完成后输入vue -V(V大写)查看是否安装成功

若提示无法识别vue,可输入npm install -g npm 更新npm 版本

3、生成项目

  (我使用的是webpack模板,更多模板可以到vue.js的github上查看,地址:https://github.com/vuejs-templates)

  在你的项目文件夹内打开命令窗口(或在命令行中进入项目目录),输入vue init webpack Vue-project ( MyVue-project是自定义的项目名称)

命令执行后,会在当前目录内生成一个以自定义项目名称命名的项目文件夹

如图进行配置,配置完成后,输入cd Vue-Project 进入项目目录,

 输入cnpm install 安装依赖包

 输入npm run dev 启动项目

//若浏览器无法加载页面,可以修改一下配置文件config里的 index.js 文件

如图:

将build路径前缀修改为‘./’,是因为打包之后,外部引入js和css文件是,以'/'开头的路径,在本地无法找到对应文件。

VUE项目安装的更多相关文章

  1. vue项目安装sass/scss

    vue 添加scss 安装好之后使用: 注意scss和sass的语法区别,scss是用传统花括号,sass是缩进控制,看个人习惯选择语言 sass语法看这里==>sass基本语法 vue项目编译 ...

  2. vue-cli新建vue项目安装axios后在IE下报错

    使用脚手架新建了一个vue项目,可以在IE9+浏览器运行,但是在添加了axios后,在IE下就报错了 首先是安装axios,在命令行执行: $ npm install axios -s //执行命令, ...

  3. vue项目安装vux

    本文章默认基于“vue init webpack myproject”已经搭好基本的项目, 而且本文是从我有道笔记拷贝稍加修改过来的 本来我私人笔记写给自己看的所以有些地方可能描述不够清晰 需要修改的 ...

  4. 运行vue项目--安装vue脚手架vue cli

    第一步. 安装node: 官网下载node的.pkg,下载地址,选择相应版本进行下载 mac终端下输入npm -v 和 node -v, 出现相应版本号即安装成功. 若均提示 command not ...

  5. Vue项目安装CubeUI

    CubeUi GitHub地址:https://github.com/didi/cube-ui install vue add cube-ui 项目中 会多出cube ui 的配置文件来

  6. vue项目安装scss,以及安装scss报错(this.getResolve is not a function)

    1.安装scss: npm install node-sass sass-loader vue-style-loader --save-dev //安装node-sass sass-loader vu ...

  7. vue项目安装sass步骤等遇到的问题

    1.安装sass依赖包 npm install --save-dev sass-loader 注释(可能会出现问题:sass-loader版本过高导致,可以将其package.json中的版本改为7. ...

  8. vue 项目安装sass的依赖包

    安装sass的依赖包 npm install --save-dev sass-loader //sass-loader依赖于node-sass npm install --save-dev node- ...

  9. vue 项目安装

    安装stylus npm install stylus stylus-loader --save-dev

随机推荐

  1. 【洛谷P2215】上升序列

    题目大意:给定一个长度为 N 的序列,有 M 个询问,每个询问要求输出长度为 L 的上升子序列,若不存在,输出 impossible,若存在,输出下标字典序最小的一个. 题解:考虑到若 L 大于整个序 ...

  2. 【CH6802】车的放置

    题目大意:给定一个 N*M 的棋盘,棋盘上有些点不能放置任何东西,现在在棋盘上放置一些车,问最多可以放置多少个车而不会互相攻击. 题解:将放置一个车看作连接一条无向边,因为每一行和每一列之间只能放置一 ...

  3. Django(十一)请求生命周期之响应内容(请求/响应 头/体)

    https://www.cnblogs.com/renpingsheng/p/7534897.html Django请求生命周期之响应内容 http提交数据的方式有"post",& ...

  4. Python之迭代器,生成器

    迭代器 1.什么是可迭代对象 字符串.列表.元组.字典.集合都可以被for循环,说明他们都是可迭代的. from collections import Iterable l = [1,2,3,4] t ...

  5. 第二十节,使用RNN网络拟合回声信号序列

    这一节使用TensorFlow中的函数搭建一个简单的RNN网络,使用一串随机的模拟数据作为原始信号,让RNN网络来拟合其对应的回声信号. 样本数据为一串随机的由0,1组成的数字,将其当成发射出去的一串 ...

  6. Contest1593 - 2018-2019赛季多校联合新生训练赛第三场(部分题解)

    H 10255 自然数无序拆分 H 传送门 题干: 题目描述 美羊羊给喜羊羊和沸羊羊出了一道难题,说谁能先做出来,我就奖励给他我自己做的一样礼物.沸羊羊这下可乐了,于是马上答应立刻做出来,喜羊羊见状, ...

  7. vue实现购物车和地址选配

    参考文献        vue.js官网 项目演示:数据渲染,格式化数据,点击加,减号自动加减 项目准备 1. 项目css和js文件  https://github.com/4561231/hello ...

  8. php 4种传值方式

    我们定义page01.php和page02.php两个php文件,将page01中的内容想办法传递到page02,然后供我们继续使用. 第一种:     使用客户端浏览器的cookie.cookie很 ...

  9. 将二维list某列组成新的list

    # encoding: utf-8 import decimal import requests import logging import logging.config import random ...

  10. 6-(基础入门篇)学会编译lua固件,固件的合成

    http://www.cnblogs.com/yangfengwu/p/9336274.html 基础教程源码链接请在淘宝介绍中下载,由于链接很容易失效,如果失效请联系卖家,谢谢 https://it ...