Vue项目安装

刚刚开始学习Vue.js。今天分享一下我的Vue项目安装过程。

我是windows系统,使用安装工具是NPM

一、Vue安装

1、检查是否已经安装了node和npm

  在命令窗口(windoes + R 键打开输入cmd确认)输入node -v 和npm -v,如果显示出版本号,说明安装成功

2、安装vue-cli

  在全局安装vue-cli 

npm install -g vue-cli

(这种方法安装较慢,可以使用国内淘宝镜像安装:npm install -g cnpm --registry=https://registry.npm.taobao.org/

  如果安装失败,可以使用 npm cache clean清理缓存,然后再重新安装。

输入cnpm -v 查看是否安装成功,输入cnpm install -g vue-cli 安装vue-cli和webpack )

完成后输入vue -V(V大写)查看是否安装成功

若提示无法识别vue,可输入npm install -g npm 更新npm 版本

3、生成项目

  (我使用的是webpack模板,更多模板可以到vue.js的github上查看,地址:https://github.com/vuejs-templates)

  在你的项目文件夹内打开命令窗口(或在命令行中进入项目目录),输入vue init webpack Vue-project ( MyVue-project是自定义的项目名称)

命令执行后,会在当前目录内生成一个以自定义项目名称命名的项目文件夹

如图进行配置,配置完成后,输入cd Vue-Project 进入项目目录,

 输入cnpm install 安装依赖包

 输入npm run dev 启动项目

//若浏览器无法加载页面,可以修改一下配置文件config里的 index.js 文件

如图:

将build路径前缀修改为‘./’,是因为打包之后,外部引入js和css文件是,以‘/‘开头的路径,在本地无法找到对应文件。

项目未写完,所以打包上线部分稍后再记录。

时间: 2024-10-11 05:21:30

Vue项目安装的相关文章

vue的安装和项目构建

第一种方法: 先安装好note.js 第一步  :改淘宝镜像  npm install -g cnpm --registry=https://registry.npm.taobao.org第二步  :安装vue项目脚手架工具 cnpm install -g @vue/cli第三步  :安装项目脚手架 vue create my-project(自定义项目名称) 安装好node js和vue js之后也可以通过下面的代码来在cmd里面输入 第一步: npm install -g yarn 第二步:

Sentry项目监控工具结合vue的安装与使用(前端)

一.官网:https://sentry.io/welcome/ 二.介绍 Sentry 是一个开源的实时错误报告工具,支持 web 前后端.移动应用以及游戏,支持 Python.OC.Java.Go.Node.Django.RoR 等主流编程语言和框架 ,还提供了 GitHub.Slack.Trello 等常见开发工具的集成.可以多团队.多开发一起管理. 三.安装 1.首先你得有个Sentry的账号,这个就不多说了,自己去注册一个 2.注册成功后进入系统首先修改下语言和时区 a.语言全是英文,如

vue项目中安装使用vux

vux是个vue的移动端框架. 目前移动端UI框架这么多,为啥选择vux呢?vux虽然说是个个人维护项目,但是有15000+个star,应该不比其他的团队开源框架差. 最重要的是,目前要做微信公众号和小程序的开发,想着UI风格最好和微信的一致,于是,就决定入坑vux.... 确实,刚开始安装使用就遇到了问题,现在记录一下正确的步骤. 本人使用webstorm IDE. 前面安装vue, nodejs,配置全局的vue-cli都不表了,网上很多教程. 1.创建一个vue项目,选择路径,项目名等信息

vue-cli安装与vue项目创建

首先查看npm版本     npm 是node的命令  没有的先安装node 然后执行 npm install -g vue-cli 如果执行这句命令有问题,则需要将npm的仓库地址改为淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 然后再用cnpm安装vue-cli. cnpm i -g vue-cli 创建 vue项目 vue init webpack <项目名称> 后面根据提示选择或输入对应的字符串

vue脚手架安装,新建项目,打包

1.安装node.js 从node官网下载并安装node,安装步骤很简单,只要一路“next”就可以了. 2.安装cnpm 淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 3.安装vue cnpm install vue 4.安装脚手架 cnpm install --global vue-cli 5.新建一个项目 vue init webpack 项目名称运行初始化命令的时候回让用户输入几个基本的选项,如项目

macos安装vue-cli初始化vue项目

当换台机器使用时,总是避免不了要装好环境进行开发,而这些步骤如果不是经常操作,忘记的可能性非常大,此时我们就可以查阅自己的博客进行安装新环境,话不多说,以下为步骤: 安装nodejs 安装vue-cli npm install -g vue-cli ps: 如果想尽快安装进度,可以通过淘宝的镜像使用cnpm提高效率,安装cnpm输入:npm install -g cnpm --registry=https://registry.npm.taobao.org ,安装完毕输入:cnpm -v 查询版

CentOS7 安装nginx部署vue项目

简单描述:代码开发完了,需要环境来运行测试.服务器上没有nginx,搞起搞起. 在Centos下,yum源不提供nginx的安装,可以通过切换yum源的方法获取安装.也可以通过直接下载安装包的方法,**以下命令均需root权限执行**:   首先安装必要的库(nginx 中gzip模块需要 zlib 库,rewrite模块需要 pcre 库,ssl 功能需要openssl库).选定**/usr/local**为安装目录,以下具体版本号根据实际改变. 安装:1.安装gcc gcc-c++(如新环境

vue项目搭建

VUE项目搭建 # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新项目 $ vue init webpack my-project # 安装依赖,走你 $ cd my-project $ npm install $ npm run dev

vue-cli+webpack搭建简单的vue项目框架

0.先去官网下载安装nodeJS 1.在cmd中输入命令 node -version    若出现node版本号 则安装成功 2.通过命令:cd 文件夹名     进入某具体文件夹后进行如下命令操作: 3.npm install -g vue-cli         全局下安装vue-cli脚手架 4.vue init webpack project    初始化项目 此处会出现一些选项,进行图片上的操作即可 5.cd  project        进入所需project项目文件夹 5.npm