前端框架

使用vue脚手架搭建项目

2019-07-24  本文已影响62人  John_Phil

下载node.js
https://nodejs.org/en/download/

image.png 安装

验证是否安装成功使用如下命令查看版本号

node -v
npm  -v
验证是否安装成功

使用淘宝镜像 下载会更快一些
安装成功之后,就可以用 cnpm 替代 npm

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

安装vue-cli

安装结束之后,使用vue -v查看vue的版本。

npm install -g vue-cli /cnpm i -g vue-cli
vue -v

使用vue-cli创建项目

步骤:
选择项目所在的位置,通过命令行进入该目录(或者直接在该目录,右键,打开命令行)。
使用脚手架安装项目: vue init webpack demo 项目是基于webpack的
Project name(工程名):回车
Project description(工程介绍):回车
Author:作者名
Vue build(是否安装编译器):回车
Install vue-router(是否安装Vue路由):y
Use ESLint to lint your code(是否使用ESLint检查js代码):n
Set up unit tests(安装单元测试工具):n
Setup e2e tests with Nightwatch(是否安装端到端测试工具):n
Should we run npm install for you after the project has been created? (recommended):回车。


安装选项图片

启动项目
进入项目目录:cd demo
安装项目所需要的依赖:npm install
启动项目:npm run dev
启动成功,浏览器打开:localhost:8080,即可看到vue项目

cd vuetest1
npm install
npm run dev

npm安装项目依赖
安装完成
启动项目
访问成功
上一篇下一篇

猜你喜欢

热点阅读