前端VUE3框架的快速搭建
- 安装nodejs
- 创建一个 Vue 应用
- 精简VUE项目
- 在idea中运行vue项目
- 修改标题
- 定义全局css样式
- 404页面
安装nodejs
参考:在MAC上面通过HomeBrew安装node和npm@指定版本
https://blog.csdn.net/yu_fu_a_bu/article/details/145810229
vue3推荐使用 nodejs v22
npm 版本:10.9.2
创建一个 Vue 应用
liujinglong@192 ~ % cd /Users/liujinglong/workplace
liujinglong@192 workplace % cd yufuabu
liujinglong@192 yufuabu % npm create vue@latest
精简VUE项目
在idea中运行vue项目
修改标题
定义全局css样式
404页面
<script setup>
</script>
<template>
<div style="height: 100vh;display: flex;justify-content: center;align-items: center;">
<div class="error">
<img src="@/assets/imgs/404.png" alt="404">
<div style="text-align: center;padding: 20px 0;font-size: 20px; color: #0d0dd8">
<router-link to="/" style="color: #5050b8">
返回首页
</router-link>
</div>
</div>
</div>
</template>
<style scoped>
</style>