Node.js+Vue脚手架环境搭建的方法步骤


Posted in Javascript onMarch 08, 2020

Node.js的下载

node下载地址:https://nodejs.org/zh-cn/download/

下载后安装即可。新版Node.js自带npm包管理器

# 查看node的版本
node -v
# v12.16.1
# 查看npm版本
npm -v
#6.13.4

第一个Node.js程序,新建helloworld.js文件,内容如下

console.log("Hello World")
console.log("第一个Node.js程序!")

进入终端 node helloworld.js

注意:
node安装路径默认为/usr/local/bin/node
npm路径为/usr/local/bin/npm

搭建Vue CLI脚手架

Vue CLI是一个基于Vue.js进行快速开发的完整系统
Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -gyarn global remove vue-cli 卸载它。
Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)

设置淘宝镜像

npm config set registry https://registry.npm.taobao.org

# 查看是否设置成功
npm get registry

安装

# -g表示全局安装
sudo npm install -g @vue/cli
# 或则
sudo yarn global add @vue/cli

安装好后就可以在终端终端中访问vue命令

vue -V

安装全局插件,详情见官网

sudo npm install -g @vue/cli-service-global

# 安装成功提示
+ @vue/cli-service-global@4.2.3
added 1216 packages from 866 contributors in 83.013s

创建第一个应用程序

# 通过图形化界面方式创建项目(新手推荐)
vue ui

Node.js+Vue脚手架环境搭建的方法步骤

Node.js+Vue脚手架环境搭建的方法步骤

下一步->预设(选择默认) -> 下一步

Node.js+Vue脚手架环境搭建的方法步骤

Node.js+Vue脚手架环境搭建的方法步骤

在浏览器中输入地址

Node.js+Vue脚手架环境搭建的方法步骤

可能遇到的坑

1.输入npm install -g @vue/cli后,停留在此界面

Node.js+Vue脚手架环境搭建的方法步骤

解决:

设置淘宝镜像: npm config set registry https://registry.npm.taobao.org

2.提示权限不足!

Node.js+Vue脚手架环境搭建的方法步骤

再npm命令前加sudosudo npm install -g @vue/cli

到此这篇关于Node.js+Vue脚手架环境搭建的方法步骤的文章就介绍到这了,更多相关Node.js Vue脚手架搭建内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript 学习点滴记录
Apr 24 Javascript
Prototype 学习 工具函数学习($方法)
Jul 12 Javascript
代码触发js事件(click、change)示例应用
Dec 13 Javascript
在JavaScript中访问字符串的子串
Jul 07 Javascript
jquery实现简单合拢与展开网页面板的方法
Sep 01 Javascript
简单实现AngularJS轮播图效果
Apr 10 Javascript
Vue.js组件tab实现选项卡切换
Mar 23 Javascript
详解Vue用自定义指令完成一个下拉菜单(select组件)
Oct 31 Javascript
AngularJS基于MVC的复杂操作实例讲解
Dec 31 Javascript
JavaScript实现计算圆周率到小数点后100位的方法示例
May 08 Javascript
JavaScript使用canvas绘制随机验证码
Feb 17 Javascript
微信小程序绘制半圆(弧形)进度条
Nov 18 Javascript
JS中的const命令你真懂它吗
Mar 08 #Javascript
Vue2.4+新增属性.sync、$attrs、$listeners的具体使用
Mar 08 #Javascript
Vue vm.$attrs使用场景详解
Mar 08 #Javascript
浅谈Vue2.4.0 $attrs与inheritAttrs的具体使用
Mar 08 #Javascript
vue-cli点击实现全屏功能
Mar 07 #Javascript
vue全屏事件开发详解
Jun 17 #Javascript
vue实现全屏滚动效果(非fullpage.js)
Mar 07 #Javascript
You might like
PHP&MYSQL服务器配置说明
2006/10/09 PHP
使用array mutisort 实现按某字段对数据排序
2013/06/18 PHP
Windows下的PHP 5.3.x安装 Zend Guard Loader教程
2014/09/06 PHP
yii2中的rules 自定义验证规则详解
2016/04/19 PHP
总结PHP代码规范、流程规范、git规范
2018/06/18 PHP
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
2009/11/30 Javascript
javascript开发中因空格引发的错误
2010/11/08 Javascript
JavaScript修改浏览器tab标题小技巧
2015/01/06 Javascript
jQuery解决浏览器兼容性问题案例分析
2016/04/15 Javascript
Jquery插件仿百度搜索关键字自动匹配功能
2016/05/11 Javascript
javascript实现抽奖程序的简单实例
2016/06/07 Javascript
jQuery下拉框的简单应用
2016/06/24 Javascript
JS禁止查看网页源代码的实现方法
2016/10/12 Javascript
javascript基于原型链的继承及call和apply函数用法分析
2016/12/15 Javascript
浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题
2017/09/02 Javascript
layer弹出层显示在top顶层的方法
2019/09/11 Javascript
python实现去除下载电影和电视剧文件名中的多余字符的方法
2014/09/23 Python
Python实现提取谷歌音乐搜索结果的方法
2015/07/10 Python
简单掌握Python的Collections模块中counter结构的用法
2016/07/07 Python
[原创]Python入门教程4. 元组基本操作
2018/10/31 Python
Python unittest 简单实现参数化的方法
2018/11/30 Python
django-rest-swagger的优化使用方法
2019/08/29 Python
python词云库wordCloud使用方法详解(解决中文乱码)
2020/02/17 Python
Django中使用Celery的方法步骤
2020/12/07 Python
医院护士求职自荐信格式
2013/09/21 职场文书
大学军训感言400字
2014/03/11 职场文书
咖啡店创业计划书
2014/08/15 职场文书
审计班子对照检查材料
2014/08/27 职场文书
2016大学自主招生推荐信范文
2015/03/23 职场文书
紫日观后感
2015/06/05 职场文书
车位出租协议书范本
2016/03/19 职场文书
描写九月优美句子(39条)
2019/09/11 职场文书
2019年妇科护士的自我鉴定(3篇)
2019/09/26 职场文书
小学三年级作文之写景
2019/11/05 职场文书
Nginx反向代理及负载均衡如何实现(基于linux)
2021/03/31 Servers
Python装饰器的练习题
2021/11/23 Python