创建一个VUE Cli工程,安装vue

Vue CLI是Vue.js官方推荐的创建和管理Vue.js项目的工具。通过提供一系列标准化的工具和流程,它帮助开发者提高开发效率,快速构建现代化的web单页面应用。

一、Vue是什么?

Vue CLI是Vue.js官方推荐的创建和管理Vue.js项目的工具。通过提供一系列标准化的工具和流程,它帮助开发者提高开发效率,快速构建现代化的web单页面应用。它具备以下核心特性:

1. 交互式脚手架:Vue CLI提供了一套交互式脚手架,可以根据用户的选择自动生成项目结构,包括目录、文件和预设配置,从而极大地简化了项目的初始化过程。

2. 自动化服务依赖管理:Vue CLI能够自动处理项目中的服务依赖,如热重载、代码压缩等,使开发者能够专注于应用的业务逻辑开发,提高开发效率。

3. 运行环境要求:为了使用Vue CLI,开发者需要先安装Node.js和npm(Node.js包管理器),因为Vue CLI是基于Node.js运行的。

4. 灵活的插件系统:Vue CLI支持插件系统,允许开发者根据项目需求添加或移除功能,从而提供了高度的灵活性和可扩展性。

5. 一致的开发体验:Vue CLI与Vue.js生态系统紧密集成,提供了一致的开发体验,同时支持Vuex、Vue Router等库的无缝配合,使开发者能够更加便捷地开发Vue.js应用。

6. 多页面应用支持:除了支持传统的单页面应用(SPA)外,Vue CLI还提供了对多页面应用(MPA)的支持,满足了不同项目的需求。

二、安装步骤

1.安装Node.js

官网:Node.js — Run JavaScript Everywhere (nodejs.org)

点击Download进行下载,安装。

下载完成后进行安装,一直点击next。

注意点击 I accept the terms in the License Agreement

2.检查npm命令是否可用

使用Windows+R 输入cmd 进入 命令提示符
输入:npm -v

C:\Users\用户名>npm -v
10.5.0

出现这些内容表示npm可用。

3.配置npm

配置 npm 源的命令如下:
npm config set registry https://registry.npmmirror.com
当配置成功后,可通过 get 命令可查看 npm 源:
npm config get registry

4. 安装VUE Cli

安装VUE CIi的命令如下:

npm insta11 -g @vue/cli

安装完成后,可通过以下命令检验VUECIi是否安装成功

vue -V        V是大写

C:\Users\用户名>vue -V

@vue/cli 5.0.8

出现这些内容表示安装成功。

5.创建工程

点击进入IntelliJ IDEA ,点击下方的终端输入

vue create 工程名称

Eg:

vue create project1

用上下的键盘按钮,向下选择第三个,点击回车Enter

使用上下按钮,用空格键进行选择和取消,完成后点击Enter回车

选择3.x 点击回车

输入Y 确定

选择第二个In package.json 点击回车

输入N 点回车

加载到这一步,先输入 cd project1

PS D:\JAVA\Web> cd project1

在输入npm run serve

PS D:\JAVA\Web>project1> npm run serve

这个时候就创建好了

点击上面的Local的url,可以出现这个页面


结束

相关推荐

  1. vue创建项目

    2024-04-21 19:46:02       37 阅读
  2. 重学 VUE —— 创建应用

    2024-04-21 19:46:02       51 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-04-21 19:46:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-04-21 19:46:02       100 阅读
  3. 在Django里面运行非项目文件

    2024-04-21 19:46:02       82 阅读
  4. Python语言-面向对象

    2024-04-21 19:46:02       91 阅读

热门阅读

  1. oracle快速定位数据库瓶颈

    2024-04-21 19:46:02       29 阅读
  2. Oracle中的CASE WHEN语句使用详解与实例

    2024-04-21 19:46:02       34 阅读
  3. OracleDay01

    2024-04-21 19:46:02       36 阅读
  4. FFmpeg:自实现ijkplayer播放器--11音视频同步

    2024-04-21 19:46:02       34 阅读
  5. 在Rust中使用ini配置文件

    2024-04-21 19:46:02       34 阅读
  6. Rust开发笔记 | Rust的交互式Shell

    2024-04-21 19:46:02       38 阅读
  7. NVIC简介

    2024-04-21 19:46:02       33 阅读
  8. Python与设计模式之适配器的使用方法

    2024-04-21 19:46:02       30 阅读
  9. 三七互娱,oppo,快手25届暑期实习内推

    2024-04-21 19:46:02       36 阅读