前端:VUE-(0)-环境搭建和helloworld

1.vite构建

启动

2.环境搭建

快速上手 | Vue.js

2.1.需要有node.js环境

在工程创建的目录下打开cmd界面

路径:不出现中文

2.2 编辑器 vscode插件

public 页签图标

npm i 安装所有的依赖

3.文件解析

3.1.env.d.ts:

用于配置支持识别的 文件类型 官方写好的。

CTROL+点击 可以看到支持的文件类型。

3.2.index.html

入口文件:index.html

3.3.package.json

如何启动一个前端项目

1.查找命令名

2.回到console界面

如果运行正常,显示如下

3.4 vite.config.ts

整个工程的配置文件

4.SRC

必有的

App.vue 和 main.ts

入口

4.1 index

引入main.ts

main.ts

在这个文件里把工程中所有的app都定义出来的了。

import A from './A.VUE'

import B from './B.VUE'

import C from './C.VUE'

把创建的app放入工程中

createApp(App).mount('#app') //挂载在容器中

createApp(A).mount('#app')

createApp(B).mount('#app')

createApp(C).mount('#app')

index是必须要有2个元素的。

4

4.2App.vue

文件结构

VUE3 用的是ts

示例:

4.3main.ts

打开后

绿色文件不动

相关推荐
笨笨狗吞噬者5 分钟前
Opus 4.7 使用体验
前端·ai编程
No8g攻城狮17 分钟前
【前端】Vue 中 const、var、let 的区别
前端·javascript·vue.js
文心快码BaiduComate22 分钟前
Comate搭载Kimi K2.6,长程13h!
前端·后端·程序员
豹哥学前端32 分钟前
新手小白学前端day4: Position定位
前端
fishmemory7sec38 分钟前
Vue大屏自适应容器组件:v-scale-screen
前端·javascript·vue.js
饺子不吃醋39 分钟前
Promise原理、手写与 async、await
前端·javascript
PILIPALAPENG43 分钟前
第3周 Day 2:Function Calling —— 让 Agent 听懂人话,自己干活
前端·人工智能·python
前端那点事1 小时前
Vue3+TS 中 this 指向机制全解析(实战避坑版)
vue.js
袋鼠云数栈UED团队1 小时前
基于 OpenSpec 实现规范驱动开发
前端·人工智能
JarvanMo1 小时前
GetX 作者的 GitHub 账号被封,又默默恢复了——但问题远没有解决
前端