总结:

# 全局安装 vue-cli
$ npm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 安装依赖,走你
$ cd my-project
# 安装依赖





$ npm install
# 运行
$ npm run dev

具体步骤:

1.首先建立一个文件夹(禁止使用中文名),打开文件夹 ,按住shift+鼠标右键 ,选在此处打开命令行窗口

2.如果没有安装node,则安装node

3.安装完之后,在命令行输入 node -v 查看版本号;

(1)node有自带的npm,进行全局命令安装 (npm install --global vue-cli)

(2)----想安装速度快点,可以使用淘宝镜像如下

----命令提示符执行 npm install cnpm -g --registry=https://registry.npm.taobao.org

安装完成淘宝镜像后输入 cnpm -v 查看其版本号;

在命令行输入  cnpm install --global vue-cli;

4.安装完成后 命令行输入 vue  -V  检查vue是否安装成功

5.使用vue建立一个项目名为“my-project”

----注:vue-cli 的模板包括 webpack 和 webpack-simple,前者是比较复杂专业的项目,他的配置并不全放在根目录下的          webpack.config.js 中。

----webpack-simple 相对简单的,它根目录下才有个 webpack.config.js。

vue init webpack my-project

6.项目创建过程中,有如下选择,选择no   (该选项为使用ESLint规范你的代码,一个空格错误都将报错,不开启,可以避免不必要的麻烦)

7.建立像猕猴,安装项目依赖 npm install 或者  cnpm install

8.安装成功,项目目录下多出一个node_modules文件夹

9.进入项目目录文件夹 (my-project),就可以使用vue进行项目开发了

10.使用npm run dev 或者 cnpm run dev 便可以打开本地服务器实时查看效果(localhost:8080)

11.初始效果

12.退出监听,可以直接ctrl+c;

vue安装--使用node的更多相关文章

  1. Mac 安装node npm cnpm vue 以及卸载 node 和 npm 的方法 清空npm缓存的方法

    S01 安装node(内含npm) 首先,到官网下载长期支持版,截止目前,最新的长期支持版本号是10.16.3 https://nodejs.org/zh-cn/download/ 下载完毕后,安装该 ...

  2. [Vue安装教程]十分钟学会vue 安装

    Vue的安装主要有一下几个步骤: 1.安装npm淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 2.安装脚手架工 ...

  3. Vue安装依赖npm install时报错问题解决方法

    1.vue的安装依赖于node.js,要确保你的计算机上已安装过node.js.    可进入cmd编辑器,输入命令 node -v进行查看.出现版本信息即成功!没有则从浏览器上面下载安装即可,没有安 ...

  4. Node.js的安装以及Node.js的模块管理

    索引: Node.js的安装以及Node.js的模块管理Node.js开发环境搭建以及对ES6的支持Node.js构建Vue.js项目Vue.js单文件组件的开发基于Vue.js的UI组件(Eleme ...

  5. vue — 安装并创建vue项目

    1.先从node.js官网(https://nodejs.org/en/download/) 下载并安装node,然后通过在命令行输入node -v命令,查看node的版本,要是出现相应的版本号就证明 ...

  6. VUE 安装&创建一个项目

    1,安装node.js vue依赖nodejs,所以首先要安装node.js 然后打开cmd,输入命令, node -v.正常出现版本号,说明你已经安装成功了 下载地址:http://nodejs.c ...

  7. vue 安装cli3.0版本,创建项目

    注意:Vue CLI需要Node.js版本8.9或更高版本(建议使用8.11.0+). 查看node版本:node -v  , 查看npm 版本  npm -v, 1.首先需要安装node.js环境 ...

  8. Vue 安装脚手架 工具 vue-cli (最新)

    假如您安装过旧版脚手架工具(vue-cli),您可以通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli卸载. Vue CLI 需要Node ...

  9. vue安装及环境搭建

    vue项目在pycharm里运行需要安装一个插件,打开settings,找到plugins,里面搜索vue.js,点击安装. vue安装 先安装node.js npm install -g @vue/ ...

随机推荐

  1. truts2标签-forEach标签

    <c:forEach begin="1" end="${obj.portnum}" step="1" varStatus=" ...

  2. flink学习笔记-快速生成Flink项目

    说明:本文为<Flink大数据项目实战>学习笔记,想通过视频系统学习Flink这个最火爆的大数据计算框架的同学,推荐学习课程: Flink大数据项目实战:http://t.cn/EJtKh ...

  3. Quadratic Residues POJ - 1808 二次剩余定理

    \(\color{#0066ff}{题目链接 }\) link \(\color{#0066ff}{ 题解 }\) 结论题 \((\frac{a}{p})=a^{\frac{p-1}{2}}\mod ...

  4. 如何实现 MySQL 的读写分离?MySQL 主从复制原理的是啥?如何解决 MySQL 主从同步的延时问题?

    如何实现 MySQL 的读写分离? 其实很简单,就是基于主从复制架构,简单来说,就搞一个主库,挂多个从库,然后我们就单单只是写主库,然后主库会自动把数据给同步到从库上去. MySQL 主从复制原理的是 ...

  5. 使用box-shadow 实现水波、音波的效果

    用到的工具 animation box-shadow html: <div class="watersource"> </div> css: .waters ...

  6. asyncjs,waterfall的使用

    waterfall waterfall(tasks, [callback]) (多个函数依次执行,且前一个的输出为后一个的输入) 按顺序依次执行多个函数.每一个函数产生的值,都将传给下一个函数.如果中 ...

  7. 牛客寒假算法基础集训营4 F Applese 的QQ群

    链接:https://ac.nowcoder.com/acm/contest/330/F来源:牛客网 Applese 有一个QQ群.在这个群中,大家互相请教问题.如 b 向 a 请教过问题,就把 a ...

  8. apache 日志分割

    Window apache 全局设置日志分割   apache  [ httpd.conf ] 配置文件 开启日志模块:LoadModule log_config_module modules/mod ...

  9. 奇偶交错排列(DFS)

    Description 一个1-n1−n的排列满足所有相邻数字奇偶性不同,那么称该排列为奇偶交错排列. 按字典序输出1-n1−n的所有奇偶交错排列. Input 输入一个整数n( 2 \le n \l ...

  10. Folyd算法(转+适合问题 )

    Folyd算法适合多源最短路的求解问题(时间复杂度(O(n^3)),单源无负权值的问题适合Dijstra(O(n^2)) 小Hi强行装作没听到,继续说道:"这个算法的核心之处在于数学归纳法- ...