首页 > 编程知识 正文

vue开发环境和生产环境,vue安装及环境配置

时间:2023-05-04 10:20:14 阅读:271571 作者:1525

vue环境搭建

浏览器 chorme

IDE:VS code 或者 WebStorm

Node.js 8.9+ ,npm

先下载 node.js 然后安装

https://nodejs.org/en/

 

下载了 windows版64位 node.js 安装

cmd 进入 dos 输入 node -v 检查 node 安装上没有

这样就已经是安装成功了,由于在国内使用npm是非常慢的,所以在这里我们推荐使用淘宝npm镜像,使用

https://registry.npm.taobao.org;

 

1、在nodejs安装路径下,新建node_global和node_cache两个文件夹

设置缓存文件夹

npm config set cache "C:Program Filesnodejsnode_cache"

设置全局模块存放路径

npm config set prefix "C:Program Filesnodejsnode_global"

基于 Node.js 安装cnpm(淘宝镜像)

npm install -g cnpm --registry=https://registry.npm.taobao.org

完成之后

通过命令配置

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

验证命令 如果返回https://registry.npm.taobao.org,说明镜像配置成功。

npm config get registry

npm info express

设置系统环境变量 PATH

以上两个红框信息都不能少

再新建系统环境变量 NODE_PATH

检查 cnpm是否已经安装好 命令 cnpm -v

执行安装命令

cnpm install vue -g

安装vue命令行工具,即vue-cli 脚手架

cnpm install vue-cli -g

创建一个vue的工作空间 如 E:vueSpace

cmd 进入该目录后建一个测试vue工程 mytest 命令如下

vue init webpack-simple mytest

一路回车至完成

查看目录

 

3、安装工程依赖模块

定位到mytest的工程目录下,安装该工程依赖的模块,这些模块将被安装在:mytestnode_module目录下,node_module文件夹会被新建,而且根据package.json的配置下载该项目的modules

cd mytest

cnpm install

此时目录如下

4、运行该项目,测试一下该项目是否能够正常工作,这种方式是用nodejs来启动。

cnpm run dev

此时浏览器弹出页面

此时vue 开发环境搭建完成

开发工具vscode 去官网下载

https://code.visualstudio.com/下载完成后安装

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。