欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

npm安装Vue(Windows)

程序员文章站 2024-03-26 09:36:23
...

npm安装Vue(Windows)

1. 安装前须知:

名称 作用
npm Node.js下的包管理器
webpack 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资源的合并和打包
vue-cli 用户生成Vue工程模板。(帮助用户开始一个vue的项目,也就是给你一套vue的结构,包含基础的依赖库,只需要npm install就可以安装)

2.首先我们需要安装Node.js

nodejs其实相当于java中的jvm,它是js的运行环境,只要安装对应版本的nodejs,那你就可以用js来开发后台程序。

1.搜索官网

npm安装Vue(Windows)

2.进入官网选择下载版本

npm安装Vue(Windows)

3.开始安装

npm安装Vue(Windows)

4.同意证书

npm安装Vue(Windows)

5.选择安装位置

npm安装Vue(Windows)

6.Next

npm安装Vue(Windows)

7.Next

npm安装Vue(Windows)

8.Install

npm安装Vue(Windows)
npm安装Vue(Windows)

9.finish

npm安装Vue(Windows)

10.查看版本

npm安装Vue(Windows)

npm -v

npm安装Vue(Windows)
npm安装Vue(Windows)

3.配置Node.js

在安装目录下创建node_global和node_cache文件夹
npm安装Vue(Windows)

1.然后在cmd执行这两条命令

npm config set prefix "E:\nodejs\node_global"
npm config set cache "E:\nodejs\node_cache"

2.再配置一个镜像站提升速度

npm config set registry=http://registry.npm.taobao.org

3.查看刚刚配置的信息

npm config list

npm安装Vue(Windows)
或者也可以打开C:\Users\Administrator.npmrc这个文件查看
npm安装Vue(Windows)
检查一下镜像站行不行

npm config get registry

npm安装Vue(Windows)

4.升级npm

npm install npm -g

npm安装Vue(Windows)
查看模块里面有什么项目

npm list -global

npm安装Vue(Windows)

3. 安装Vue

1.使用npm安装

-- 安装vue.js
npm install vue -g
-- 安装vue-router
npm install vue-router -g
-- 安装vue脚手架
npm install vue-cli -g

2.编辑Vue环境变量

npm安装Vue(Windows)
查看环境变量是否配置成功
npm安装Vue(Windows)

3.快速创建一个vue结构

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

cmd切换到自己想要的盘符执行下面的命令

vue init webpack VueDemo

npm安装Vue(Windows)

4.初始化安装依赖

进入刚刚创建项目的目录

cd VueDemo

安装依赖

npm install

启动项目

npm run dev

npm安装Vue(Windows)
成功
npm安装Vue(Windows)
用IDEA打开
npm安装Vue(Windows)

相关标签: Vue