vue-cli3 简单实践（一）

悠悠 2021-11-22 14:26 189阅读 0赞

### 文章目录 ###

*  概述
 *  官网
 *  安装
 *  创建项目
 *   *  使用图形化界面
     *  使用命令行

# 概述 #

本篇用于学习vue-cli3，你还在使用vue-cli2构建项目吗？是时候使用vue-cli3来秀一下操作了。

# 官网 #

官网地址：[https://cli.vuejs.org/zh/guide/][https_cli.vuejs.org_zh_guide]

# 安装 #

npm install -g @vue/cli

安装完成后，查下版本

vue --version

检查其版本是否正确 (3.x)

底下这个也装下，以后会用上

npm install -g @vue/cli-service-global

# 创建项目 #

## 使用图形化界面 ##

秀操作的的时候来了，想要简单的可视化操作，执行如下命令行：

vue ui

![在这里插入图片描述][20190724180635143.png]  
跑起来了，打开了一个页面  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9tZW5waGlzLmJsb2cuY3Nkbi5uZXQ_size_16_color_FFFFFF_t_70]  
可视化界面，可以做很多是事情，创建项目流程化等等。

## 使用命令行 ##

你可以采用传统的命令行方式，如下创建项目命令行：

vue create hello-world

接下来一步步，回车自定义选择组件等。对了，命令行勾选：使用 空格键  
![在这里插入图片描述][20190724181148609.png]

[https_cli.vuejs.org_zh_guide]: https://cli.vuejs.org/zh/guide/
[20190724180635143.png]: /images/20211122/37bd067abcf8480a8ad4a186f7b35960.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9tZW5waGlzLmJsb2cuY3Nkbi5uZXQ_size_16_color_FFFFFF_t_70]: /images/20211122/e48f8fc9abd645c3b80df7491b5aa940.png
[20190724181148609.png]: /images/20211122/e5711e977d5f41c3a2eea7efaeea56ad.png

发表评论取消回复

表情：

评论列表（有 0 条评论，189人围观）

还没有评论，来说两句吧...

相关阅读

相关 VueCli3项目解决打包问题

背景描述：自己之前做了一个vue的小案例，但是从来没有用过npm run build,果真遇到了挺多令人头疼的问题！然后在这里和大家分享一下！项目技术：VueCli3脚手

ゞ浴缸里的玫瑰/ 2023年09月26日 10:01/ 0 赞/ 38 阅读

相关 vuecli3.0 配置vue-router

安装直接在命令行打开项目目录然后输入以下代码进行安装 npm install vue-router 配置路由 1.使用`router-view`标签设

布满荆棘的人生/ 2023年06月15日 09:49/ 0 赞/ 129 阅读

相关 vuecli3 多页面配置

vuecli3 多页面配置项目结构 1. login文件配置（有配置路由） login文件目录 lo

落日映苍穹つ/ 2023年01月19日 03:24/ 0 赞/ 344 阅读

相关快速部署vuecli3 vuecli搭建 vuecli

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

本是古典何须时尚/ 2022年12月22日 11:07/ 0 赞/ 283 阅读

相关 3.1.5 Python简单网站实践3

5，数据传输在建立了前端表单之后，就要实现前端和后端之间的数据传递。在工程当中最常用的是Ajax() Ajax是“Asynchronous Javascript and

怼烎@/ 2022年05月27日 14:07/ 0 赞/ 107 阅读

相关 3.1.3 Python简单网站实践1

下面做一个简单的，可以说是简陋的网站，来实践一下；但是网站的主要元素都会涉及，过此动手，能够了解网站的开发基本结构和内容，并且对前面的知识可以有综合应用。 1，基本结构可

r囧r小猫/ 2022年05月27日 11:50/ 0 赞/ 114 阅读

相关 Docker简单实践（一）

什么是Docker？ Docker是一个轻量级的操作系统虚拟化解决方案，在操作系统层实现虚拟化。 Docker和常规的虚拟化方案对比 1，基于操作系统内核级的虚拟化，

阳光穿透心脏的1/2处/ 2022年05月13日 01:40/ 0 赞/ 172 阅读

相关 vue-cli3 简单实践（一）

文章目录概述官网安装创建项目使用图形化界面使用命令行概述本篇用于学习vue-cli3，你还在使用

悠悠/ 2021年11月22日 14:26/ 0 赞/ 190 阅读

相关 Vuecli3+express实现跨域

目录一，本地跨域二，线上跨域 -------------------- 一，本地跨域首先，本地服务器地址开放的是3000端口，云服务器上开发的是4

阳光穿透心脏的1/2处/ 2021年07月25日 17:22/ 0 赞/ 614 阅读

相关 VueCli3中加载Cesium.js

更多Cesium示例代码：[https://sandcastle.cesium.com/][https_sandcastle.cesium.com] 首先下载Cesium.

缺乏、安全感/ 2021年07月25日 11:54/ 0 赞/ 1419 阅读