使用npm利用vue-cli搭建vue环境

最近一段时间vue js非常流行,伴随着vue2.0版本的发布,一套前端基于node环境下的自动化环境构建方法随之出现,自己最近尝试用vue-cli着构建一个基于vue的环境,我尽可能的将每一个知识点讲清楚
1、npm:引自百度百科
      NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:1、允许用户从NPM服务器下载别人编写的第三方包到本地使用。2、允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。3、允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用
      我的理解就是npm是一个基于命令行的形式来进行软件的下载和上传  很方便,免去了我们去到官网上去下载。一般我们只需要下载安装nodejs即可,里面包含有npm,下载安装完成之后记得配置环境变量,这个就不详细说了
2、vue-cli
概念:我的理解就是一个官方的脚手架,下载安装这个之后你可以通过简单的几个命令就能搭建一个基于node环境的一个前端项目,由于新版的vue-cli已经集成了webpack 所以下载了这个脚手架之后就不需要在下载webpack了

言归正传,我来说说自己搭建的一个流程吧,其中也会遇到好多问题,都是一步一步百度查看的,血泪啊 哈哈~~

1、在已经下载安装了node js后,我们要把下载的包(或者说是文件)安装在哪里了,比如我执行npm install vue-cli  安装成功后我该在哪里找到他了,如果我们没有对npm的配置进行自己的设置,那么他默认情况下就会在当前目录下找node_modules 这个目录,然后把下载下来的包放在这里面,突然感觉这样有点乱,不好管理,所以开始的时候就更改npm的默认安装目录,设置方法如下

如下图,我想把以后下载全局安装的包就放在node目录下  ,创建两个文件 node_cache 和node_global 

                  

要装vue-cli,首先需要确保已经安装npm。您可以在命令行工具中输入npm -v来检查npm安装情况和版本号。如果该命令不可用,需要先安装npm。您可以直接下载node的安装包进行安装安装完成后npm也会一同安装安装完成npm后,可以使用全局安装的方式来安装vue-cli。在命令行中输入以下命令来进行安装npm install --global vue-cli。这将在全局范围内安装vue-cli,使其可以在任何位置使用。 如果您在安装过程中遇到安装速度太慢的问题,可以考虑安装淘宝镜像来加快安装速度。打开命令行工具,输入以下命令来安装淘宝镜像:npm install -g cnpm --registry=https://registry.npm.taobao.org。然后可以使用cnpm来替代npm进行安装,例如使用cnpm install --global vue-cli安装vue-cli。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [vue-clivue脚手架)安装 详细教程](https://blog.csdn.net/keke2486/article/details/119930618)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [安装vue-cli的简易过程](https://download.csdn.net/download/weixin_38667697/13632595)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值