如何创建一个Vue项目(手把手教你)

简介: 这篇文章是一篇手把手教读者如何创建Vue项目的教程,包括使用管理员身份打开命令行窗口、找到存放项目的位置、通过vue-cli初始化项目、填写项目信息、进入项目目录、启动项目等步骤,并提供了一些常见第三方库的引入方法。

前提安装好了开发环境、如果未安装好。请安装好后、来看

1、管理员身份打开窗口

在这里插入图片描述

2、找到要存放项目的地址

在这里插入图片描述

3、初始化项目

vue init webpack SCI

如果连接公司内网(可能失败)
在这里插入图片描述
在这里插入图片描述


4、填写项目的一些基本信息

这些安装的可以都不选、后期需要哪一部分直接npm就行、很方便。文件名要小写,否则报错

在这里插入图片描述

5、进入工程目录

cd sci

在这里插入图片描述

6、启动项目

npm run dev

在这里插入图片描述

7、页面效果

在这里插入图片描述

8、查看创建的项目

在这里插入图片描述

9、引入第三方库

常用的axios、elementui、vuex、avux等等。都可以通过npm 的形式加入的项目中(尽量使用管理员来执行这些命令、否则可能会提示权限不足、安装失败的情况)

10、后语

学无止境。。。。。。

相关文章
|
25天前
|
JavaScript
vue使用iconfont图标
vue使用iconfont图标
127 1
|
4天前
|
JavaScript 安全 API
iframe嵌入页面实现免登录思路(以vue为例)
通过上述步骤,可以在Vue.js项目中通过 `iframe`实现不同应用间的免登录功能。利用Token传递和消息传递机制,可以确保安全、高效地在主应用和子应用间共享登录状态。这种方法在实际项目中具有广泛的应用前景,能够显著提升用户体验。
30 8
|
5天前
|
存储 设计模式 JavaScript
Vue 组件化开发:构建高质量应用的核心
本文深入探讨了 Vue.js 组件化开发的核心概念与最佳实践。
32 1
|
5天前
|
资源调度 JavaScript 前端开发
创建vue3项目步骤以及安装第三方插件步骤【保姆级教程】
这是一篇关于创建Vue项目的详细指南,涵盖从环境搭建到项目部署的全过程。
41 1
|
1月前
|
JavaScript 关系型数据库 MySQL
基于VUE的校园二手交易平台系统设计与实现毕业设计论文模板
基于Vue的校园二手交易平台是一款专为校园用户设计的在线交易系统,提供简洁高效、安全可靠的二手商品买卖环境。平台利用Vue框架的响应式数据绑定和组件化特性,实现用户友好的界面,方便商品浏览、发布与管理。该系统采用Node.js、MySQL及B/S架构,确保稳定性和多功能模块设计,涵盖管理员和用户功能模块,促进物品循环使用,降低开销,提升环保意识,助力绿色校园文化建设。
|
2月前
|
JavaScript API 开发者
Vue是如何进行组件化的
Vue是如何进行组件化的
|
2月前
|
JavaScript 前端开发 开发者
Vue是如何劫持响应式对象的
Vue是如何劫持响应式对象的
65 18
|
2月前
|
JavaScript 前端开发 开发者
Vue是如何进行组件化的
Vue是如何进行组件化的
|
2月前
|
存储 JavaScript 前端开发
介绍一下Vue的核心功能
介绍一下Vue的核心功能
|
2月前
|
JavaScript 前端开发 API
介绍一下Vue中的响应式原理
介绍一下Vue中的响应式原理
46 1