连接转载: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. 码农眼中的数学之~矩阵专栏(附Numpy讲解)

      2.矩阵专栏¶ 吐槽一下:矩阵本身不难,但是矩阵的写作太蛋疼了 (⊙﹏⊙)汗 还好有Numpy,不然真的崩溃了... LaTex有没有一个集成了很多常用公式以及推导或者含题库的在线编辑器? 代码裤 ...

  2. QML学习笔记(四)-TabView-竖直方向

    源码:https://github.com/sueRimn/QML-ExampleDemos 作者: 狐狸家的鱼 Github: 八至 版权声明:如需转载请获取授权和联系作者 想实现垂直竖直方向的Ta ...

  3. saltstack常用命令

    Salt通过公钥加密和认证minions.想要让minion从master端接受命令,minions的密钥需要被master接受 salt-key -L #列出master上的密钥; salt-key ...

  4. bzoj3829 POI2014 FAR-FarmCraft

    题目链接 思路 用\(f[i]\)表示完成第\(i\)棵子树所需要得时间. 考虑如果有两个子树\(a\)和\(b\),如果先去完成子树\(a\),那么对于花费得时间就是\(f[b] + siz[a] ...

  5. [luogu1486][郁闷的出纳员]

    题目链接 思路 这个题其实就是对于treap中的删除操作进行一些修改.自己yy了一种做法.就是在删除的时候,如果要删除的数比这棵子树的根大,那么就把根变成根的右孩子,这样就相当于删除了整棵左子树和根节 ...

  6. react-native中的state

    我们使用两种数据来控制一个组件:props和state.props是在父组件中指定, 而且一经指定,在被指定的组件的生命周期中则不再改变. 对于需要改变的数据,我们需要使用state. 假如我们需要制 ...

  7. MySQL经典查询场景

    一.设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher).用SQL语句创建四个表并完成相关题目. 表结构如下 #建学生信息表 ...

  8. Linux:不同文件相同列字符合并文件(awk函数)

    存在file1.txt,其内容如下: H aa 0 0 1 -9 H bb 0 0 2 -9 H cc 0 0 2 -9 存在file2.txt,其内容如下: H aa 0 0 0 -9 asd qw ...

  9. Ubuntu系统修改BIOS时间问题

    http://forum.ubuntu.org.cn/viewtopic.php?t=477606 ubuntu16.04将硬件时间改为CST 原因: 在安装ubuntu双系统的情况下,ubuntu的 ...

  10. echarts柱状图鼠标移动在柱状图上显示数据给数据添加单位

    解决问题: 关键代码如下: tooltip : { trigger: 'axis', formatter:function(params){ return params[0].name+"& ...