Vue3目录调整方案详解

 更新时间:2023年11月29日 11:04:03   作者:小沐°  
默认生成的目录结构不满足我们的开发需求,所以这里需要做一些自定义改动,本文给大家分享Vue3目录调整方案,感兴趣的朋友一起看看吧

默认生成的目录结构不满足我们的开发需求,所以这里需要做一些自定义改动。

主要是以下工作:

1.删除一些初始化的默认文件

2.修改剩余代码内容

3.新增调整我们需要的目录结构

在src文件夹下创建两个新文件夹,一个叫api(请求模块的封装),一个叫utils(工具函数相关的封装)

4.拷贝全局样式和图片到assets文件夹里,然后安装预处理器支持

自定义的一些样式

验证生效:在main.js中导入,尽量往下放,保证优先级

import '@/assets/main.scss'

安装sass预处理器(没有安装的话,scss文件无法生效)

pnpm add sass -D

到此这篇关于Vue3目录调整的文章就介绍到这了,更多相关Vue3目录调整内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue项目配置多个代理服务器的多种方案

    Vue项目配置多个代理服务器的多种方案

    今天咱们来聊聊Vue项目中一个非常实用的技巧 - 如何配置多个代理服务器,相信不少小伙伴在对接多个后端服务时都遇到过跨域问题,这篇文章就教你如何优雅解决,需要的朋友可以参考下
    2025-07-07
  • vue3模块创建runtime-dom源码解析

    vue3模块创建runtime-dom源码解析

    这篇文章主要为大家介绍了vue3模块创建runtime-dom源码解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-01-01
  • vue从使用到源码实现教程详解

    vue从使用到源码实现教程详解

    这篇文章主要介绍了vue从使用到源码实现的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-09-09
  • vue+animation动画实现跑马灯效果

    vue+animation动画实现跑马灯效果

    这篇文章主要为大家详细介绍了vue+animation动画实现跑马灯效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04
  • vue-cli3 打包优化之 splitchunks详解

    vue-cli3 打包优化之 splitchunks详解

    这篇文章主要介绍了vue-cli3 打包优化之 splitchunks的相关知识,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-07-07
  • Vue生命周期区别详解

    Vue生命周期区别详解

    这篇文章主要介绍了Vue生命周期区别详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
    2021-07-07
  • elementUI中MENU菜单踩坑

    elementUI中MENU菜单踩坑

    本文主要介绍了elementUI中MENU菜单踩坑,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-04-04
  • 关于element中对el-input 自定义验证规则

    关于element中对el-input 自定义验证规则

    这篇文章主要介绍了关于element中对el-input 自定义验证规则,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-08-08
  • 基于Vue技术实现递归组件的方法

    基于Vue技术实现递归组件的方法

    这篇文章主要为大家详细介绍了基于Vue技术实现递归组件的方法 ,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-08-08
  • Vue3 给 reactive 响应式对象赋值的实现

    Vue3 给 reactive 响应式对象赋值的实现

    在Vue3中,可以使用reactive函数创建响应式对象,如果你想给这个响应式对象赋值,可以直接修改其属性,下面就来介绍一下reactive响应式对象赋值的实现,感兴趣的可以了解一下
    2025-09-09

最新评论