网站首页 > 技术文章 正文
1. Vue-cli脚手架安装,配置vue命令环境
vue-cli依赖于node.js,所以需要先安装node.js
安装好node.js后,测试看是否安装成功!
接下来安装vue-cli命令(npm install vue-cli -g)这种方式安装下载速度非常慢,所以我现在用cnpm安装。首先安装cnpm(npm install -g cnpm)
安装好后运行(cnpm install vue-cli -g)命令安装vue
安装好vue后,测试看是否安装成功!
输入命令:vue -V 或者 vue --version
vue-cli提供了几个模板给开发人员用于不同的项目,可以通过命令(vue list)查看,一般用webpack和webpack-simple的比较多,我们用webpack
2. 初始化项目,生成项目模板
命令:vue init webpack vue_demo
运行后会输入一些项目的相关配置,如:项目名,作者等…
如下所示:
生成项目ing…
项目基本生成完毕
3. 打开生成的项目目录,安装依赖和运行
进入项目目录,里面的东西就是vue-cli给我们的脚手架(初始化好的目录结构)
打开项目并运行
运行项目的命令:npm run dev
运行成功!
打开浏览器输入:http://localhost:8080 查看效果
如果你的端口被其他项目占用,vue也会用其他端口。
猜你喜欢
- 2024-09-18 .net core集成vue(.net core vue 快速开发框架)
- 2024-09-18 找工作利器:何为vue?(vue靠什么赚钱)
- 2024-09-18 我是如何把vue项目启动时间从70s优化到7秒的
- 2024-09-18 在Vue项目里面使用d3.js(vue3 directive)
- 2024-09-18 VUE项目之搭建环境(vuejs环境搭建)
- 2024-09-18 认识 vuejs、vue-cli和webpack(vue.js和vue-cli区别)
- 2024-09-18 JavaScript:ES在Vue中的实战应用(vue/essential)
- 2024-09-18 nginx环境下vue项目部署二级域名(nginx部署两个vue项目)
- 2024-09-18 用 vite 2 平滑升级 vue 2 + webpack 项目实战
- 2024-09-18 vue-cli安装与vue+echarts入门详解
- 最近发表
- 标签列表
-
- cmd/c (90)
- c++中::是什么意思 (84)
- 标签用于 (71)
- 主键只能有一个吗 (77)
- c#console.writeline不显示 (95)
- pythoncase语句 (88)
- es6includes (74)
- sqlset (76)
- apt-getinstall-y (100)
- node_modules怎么生成 (87)
- chromepost (71)
- flexdirection (73)
- c++int转char (80)
- mysqlany_value (79)
- static函数和普通函数 (84)
- el-date-picker开始日期早于结束日期 (76)
- js判断是否是json字符串 (75)
- c语言min函数头文件 (77)
- asynccallback (87)
- localstorage.removeitem (74)
- vector线程安全吗 (70)
- java (73)
- js数组插入 (83)
- mac安装java (72)
- 无效的列索引 (74)