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.搜索官网
2.进入官网选择下载版本
3.开始安装
4.同意证书
5.选择安装位置
6.Next
7.Next
8.Install
9.finish
10.查看版本
npm -v
3.配置Node.js
在安装目录下创建node_global和node_cache文件夹
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
或者也可以打开C:\Users\Administrator.npmrc这个文件查看
检查一下镜像站行不行
npm config get registry
4.升级npm
npm install npm -g
查看模块里面有什么项目
npm list -global
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环境变量
查看环境变量是否配置成功
3.快速创建一个vue结构
vue-cli工具是内置了模板包括 webpack 和 webpack-simple,前者是比较复杂专业的项目,
他的配置并不全放在根目录下的 webpack.config.js 中
cmd切换到自己想要的盘符执行下面的命令
vue init webpack VueDemo
4.初始化安装依赖
进入刚刚创建项目的目录
cd VueDemo
安装依赖
npm install
启动项目
npm run dev
成功
用IDEA打开