npm——安装教程、安装vue脚手架
npm:是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题。比如常用的有:
1)允许用户从NPM服务器下载别人编写的第三方包到本地使用。
2)允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
3)允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。
首先:先从nodejs.org中下载nodejs

如图,下载8.9.3LTS(推荐给绝大部分用户使用的)
双击安装

一直Next



可以使用默认路径,本例子中自行修改为d:\nodejs

点击Install安装

点击Finish完成
查看目录是否有以下的文件

打开控制命令行程序(CMD),检查是否正常




再看看另外2个目录,npm的本地仓库跑在系统盘c盘的用户目录了(没见到npm-cache是因为没有用过,一使用缓存目录就生成了),我们试图把这2个目录移动回到D:\nodejs
先如下图建立2个目录

然后运行以下2条命令
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

如上图,我们再来关注一下npm的本地仓库,输入命令npm list -global

输入命令npm config set registry=http://registry.npm.taobao.org 配置镜像站

输入命令npm config list 显示所有配置信息,我们关注一个配置文件
C:\Users\Administrator\.npmrc

使用文本编辑器编辑它,可以看到刚才的配置信息


检查一下镜像站行不行命令1
npm config get registry

检查一下镜像站行不行命令2
Npm info vue 看看能否获得vue的信息


注意,此时,默认的模块D:\nodejs\node_modules 目录
将会改变为D:\nodejs\node_global\node_modules 目录。
如果直接运行npm install等命令会报错的。
我们需要做1件事情:
1、增加环境变量NODE_PATH 内容是:D:\nodejs\node_global\node_modules

(注意,一下操作需要重新打开CMD让上面的环境变量生效)
一、测试NPM安装vue.js
命令:npm install vue -g
这里的-g是指安装到global全局目录去


二、测试NPM安装vue-router
命令:npm install vue-router -g


三、安装vue脚手架
运行npm install vue-cli -g


编辑环境、编辑path


对path环境变量添加D:\nodejs\node_global
win10以下版本的,横向显示PATH的,注意添加到最后时,不要有分号【;】

重新打开CMD,并且测试vue是否使用正常

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


初始化,安装依赖

npm run dev(运行dev)

自动打开浏览器http://localhost:8080/#/

npm run build
生成静态文件,打开dist文件夹下新生成的index.html文件
npm——安装教程、安装vue脚手架的更多相关文章
- npm安装使用及vue脚手架安装
公司在前端用vue开发项目,那就学习下啦,第一步,在安装vue-devtools过程中,npm作为官方manual installtion方式,肯定必不可少. NPM是随同NodeJS一起安装的包管理 ...
- python初学者学习工具安装教程&安装步骤详解
一.python安装: 版本:3.6.8 下载地址:https://www.python.org/downloads/ 安装步骤截图: 1.点击python安装包,出现下图所示界面,注意勾选A ...
- vue安装教程
Vue.js 安装教程 安装node.js https://nodejs.org/zh-cn/download/ 选择一个适合自己电脑的版本下载 下载成功, 直接安装, 全部点击下一步 然后输入 黑窗 ...
- gitlab安装教程
gitlab安装教程 安装教程 官网安装方法 https://about.gitlab.com/downloads/#centos7 1.准备 sudo yum install curl po ...
- 宝塔Linux面板安装教程
宝塔Linux面板安装教程 安装要求: 内存:512M以上,推荐768M以上(纯面板约占系统60M内存) 硬盘:300M以上可用硬盘空间(纯面板约占20M磁盘空间) 系统:CentOS 7.1+ (U ...
- 【强烈推荐,超详细,实操零失误】node.js安装 + npm安装教程 + Vue开发环境搭建
node.js安装 + npm安装教程 + Vue开发环境搭建 [强烈推荐,超详细,实操零失误] 原博客园地址:https://www.cnblogs.com/goldlong/p/8027997.h ...
- npm安装教程(vue.js)
https://www.cnblogs.com/goldlong/p/8027997.html 首先理清nodejs和npm的关系: node.js是javascript的一种运行环境,是对Googl ...
- vue开发搭建(npm安装 + vue脚手架安装)
一.概念 1.npm: Nodejs下的包管理器. 2.webpack: 它主要的用途是通过CommonJS的语法,把所有浏览器端需要发布的静态资源,做相应的准备,比如资源的合并和打包. 3.vue ...
- 关于npm和yarn 安装vue脚手架
第一篇博客有点小紧张.轻喷~ 第一步:安装node.js 地址 --------https://nodejs.org/en/ 详细步骤这里就不写了 可以去看 地址 ----- ...
随机推荐
- .Net Core应用框架Util介绍(三)
上篇介绍了Util的开发环境,并让你把Demo运行起来.本文将介绍该Demo的前端Angular运行机制以及目录结构. 目录结构 在VS上打开Util Demo,会看见如下的目录结构. 现代前端通常采 ...
- Do You Kown Asp.Net Core -- Asp.Net Core 2.0 未来web开发新趋势 Razor Page
Razor Page介绍 前言 上周期待已久的Asp.Net Core 2.0提前发布了,一下子Net圈热闹了起来,2.0带来了很多新的特性和新的功能,其中Razor Page引起我的关注,作为web ...
- Scrapy安装报错
python3 pip 安装Scrapy在win10 安装报错error: Microsoft Visual C++ 14.0 is required. Get it with "Micro ...
- Python是如何实现生成器的原理
python中函数调用的实质原理: python解释器(即python.exe)其实是用C语言编写的, 在执行python代码时,实际上是在用一个叫做Pyeval_EvalFramEx(C语言的函数) ...
- iOS 基础:Frames、Bounds 和 CGGeometry
https://segmentfault.com/a/1190000004695617 原文:<iOS Fundamentals: Frames, Bounds, and CGGeometry& ...
- Flask 快速使用 —— (1)
Flask.Django.Tornado框架 区别 1 Django:重武器,内部包含了非常多组件:ORM.Form.ModelForm.缓存.Session.中间件.信号等... 2 Flas ...
- lombok的简单使用小结
1.idea安装lombok插件 关于lombok如何在idea中使用,下面这篇博客写的很到位,并且提供了本地安装对应idea版本的lombok插件的地址.如果无法通过idea直接安装lombok,可 ...
- Jmeter常见问题(转)
收集工作中JMeter遇到的各种问题 1. JMeter的工作原理是什么? 向服务器提交请求:从服务器取回请求返回的结果. 2. JMeter的作用? JMeter可以用于测试静态或者动态 ...
- DAY16、模块和包
一.模块 1.模块的加载顺序:内存 =>内置 =>sys.path(一系列自定义模块) 2.sys.path:环境变量,存放文件路径的列表 重点:默认列表第一个元素就是当前被执行文件所在的 ...
- deepin配置Oracle JDK
这里记录一下入手deepin后,安装JDK的过程,和之前的CentOS有些不同 本篇参考了两篇博客 1 2 第一篇有些问题,在第二篇中找到了解决方案 接下来是操作过程: 检查本机自带的OpenJDK, ...