前端项目目录结构规范

最新推荐文章于 2023-05-16 17:37:58 发布
最新推荐文章于 2023-05-16 17:37:58 发布
阅读量2.4k 收藏 4
点赞数 1
分类专栏： 前端 nodejs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/buyueliuying/article/details/103641879
版权 
src
+ |- /tpl
+ |- /js
+ |- /css
+ |- /img
+ |- /font
+ |- /doc

src为源代码目录，代码编写目录
tpl:html等视图文件
js:javascript文件
css:样式文件
img:图片
font:字体文件
doc:文档文件

asset
+ |- /tpl
+ |- /js
+ |- /css

src为构建工具生成后的目录，也就是webpack默认构建的dist目录

buyue__
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
我的前端项目目录约定和基础规范建议。一个5年前端接触者的推荐
海天酱油zz
05-29 1366
甘雨镇楼 废话 其实我以前觉得这个文章没必要写。但是干前端三年多（15年底接触前端开发），我发现后端做前端的时候，前端新手入学的时候对于这个基础的约定规范，都是东拼西凑，慢慢的把自己的风格习惯搭建起来。而很多没有追求的就是穷举写法。写到哪里是哪里。 我这里会对于我个人这些年逐步沉淀的习惯分享给大家。有react的见解也有vue的见解。大家互相促进 文后有阿里前端九部规范文档 一、我的目录结构 1、目录结构 项目是vue项目，但是react其实也差不多。 config ...
前端常用工程目录结构以及作用
最新发布
爱学习_萌萌哒
07-02 572
src：前端项目的源代码目录。api：与后端 API 交互的代码。assets：静态资源文件。components：独立的功能模块组件。directive：自定义指令。layout：布局组件。plugins：插件配置和初始化。router：路由配置。store：Vuex 状态管理。utils：工具函数。views：视图组件。App.vue：应用的根组件。main.js：应用的入口文件。：权限管理代码。：全局设置和配置。
前端项目目录管理-部署结构
Lee_Lei0213的博客
05-05 403
一、人生第一次做规划项目，以前都是跟着前端的老大，他把一切都规划好了，我跟着做就可以了，这次要自己规划前端目录结构，好紧张，参考了众多文章，结果还是看不太懂，百度前端工具框架–fis，没怎么看得懂，所以没用，还是自己好好想把，我还是主要参考了，我上次做项目时，那个项目负责人是怎么规划项目的。 二、前端结构 　　1、首先我想到需要的功能就是，把js、css、UI组件、库文件、grunt...
前端开发的正确姿势——各种文件的目录结构规划及引用
weixin_33919950的博客
01-30 928
　　首先，要说的是我们领导总挂在嘴边的一句话：一入前端深似海。之前没有接触过前端，一直不懂这句话的含义，直到最近写作业改需求的时候才发现，因为web页面是直接面向客户的，所以需求的修改都和前端有关，有时候甚至不需要修改后台的代码就可以满足新的需求。突然对前端工程师的未来表示担忧，于我来说，这些繁琐的细节性工作我希望始终与其保持安全距离，嘻嘻！ 　　不喜归不喜，然而python是一门自动化语言，分...
前端工程目录结构
weixin_34387468的博客
05-07 3550
2.按 Feature来划分，每个Feature里面有Controllers、Views、Models...这样归类 1.主目录结构 -ProjectDemo --Features //模块。包含各个模块的Model,View,Controller,Manager --categories //类目。包含各种类的分类 --Framewo...
项目目录结构的讲解【武理解析前端用户交互系统】
fujiaxiaoshao的博客
12-23 985
下图为在IDEA下新建的web项目的目录结构，目前我们只需要关注src和web两个目录即可。 src目录用于存储.java文件，web目录用于存储jsp、html、css、js、imges等文件
Web前端项目开发规范 .pdf
10-16
3. 项目结构：项目目录应清晰有序，包括源码、编译后的文件、资源文件（如图片、字体）和配置文件等，遵循模块化和分层的原则，以提高代码可读性。 三、命名规范 1. 驼峰式命名法：在JavaScript中，变量和函数名应...
前端文件结构规范1
08-08
本文主要讨论的是一个前端文件结构规范，尤其关注JavaScript和JSP文件的组织。规范的目的是为了统一和规范化项目中的文件结构及其依赖关系，确保项目的清晰度和可扩展性。 首先，基本的文件结构如下： 1. **JS ...
阿里前端开发规范.pdf
05-08
阿里前端开发规范是一份详尽的指南，旨在提高团队协作效率和代码质量。这份规范涵盖了多个方面的编程规约，包括命名规范、HTML 规范、CSS 规范、LESS 规范以及 JavaScript 规范，并专门针对 Vue 项目提出了特别的...
Vue前端开发规范整理(推荐)
08-27
Vue 前端开发规范整理 Vue 前端开发规范是基于 Vue 官方风格指南整理的关于 Vue 前端开发的规范，这些规范对于提高代码质量和维护性非常重要。本文将对这些规范进行详细的解释和说明。 组件名 组件名应该始终是...
前端项目目录结构
King Saj
07-02 3901
结构一 ├── build # 构建相关 ├── mock # 项目mock 模拟数据 ├── plop-templates # 基本模板 ├── public # 静态资源 │ │── favicon.ico # favicon图标 │ └── index.html # html模板 ├── src .
html 项目 目录架构,前端项目目录结构规范.pdf
weixin_32518073的博客
06-25 784
前端项目目录结构规范前前端端项项目目目目录录结结构构规规范范简简介介该文档主要的设计 目标是项 目开发的目录结构保持一致，使容易理解并方 构建与管理。要要求求在本文档中，使用的关键字会以中文+括号包含的关键字英文表示：必须(MUST) 。关键字"MUST", "MUST NOT", "REQUIRED","SHALL", "SHALL NOT", ...
前端架构，项目目录结构
热门推荐
like_jack的博客
03-20 2万+
建立一个好的前端架构是开始开发Web应用或网站的一个基本步骤。良好的实践和编码常规是必不可少的，但是结构呢？我们如何在可控的时间内构思一个好的架构？但最重要的事情是，我们应该从哪里开始？当我开始思考这个问题时，我意识到一些事情：我想要一个多页面项目（一个Web应用或网站）； 我希望我的项目支持不同的屏幕尺寸和分辨率，换句话说，我希望它是响应式的； 我希望最终产品是可被维护的； 我希望最终产品性
前端目录
weixin_33955681的博客
05-28 332
博客目录总纲首页 https://www.cnblogs.com/machangwei-8/p/9565009.html css 盒子模型理解：https://www.cnblogs.com/clearsky/p/5696286.html html页面布局 转载于:https://www.cnblogs.com/machangwei-8/p/10936205.html...
前端目录结构
m0_65912225的博客
05-31 641
├── build // 构建相关 ├── config // 配置相关 ├── src // 源代码 │ ├── api // 所有请求 │ ├── assets // 主题 字体等静态资源 │ ├── components // 全局公用组件 │ ├── directive // 全局指令 │ ├── filtres // 全局 filter │ ├── icons // 项目所有 svg icons │ ├── lang // 国际化 language......
【项目组织】前端项目`Api`模块的目录结构建设
等时钟成长
07-14 539
前端项目Api模块的目录结构建设 文章目录前端项目`Api`模块的目录结构建设`model``route``method` 按模块建目录，内部目录结构如下: x-module ├── model │ └── xModel.ts |── route | └── xRoute.ts ├── xMethod.ts 假如系统有user 和 menu 两大模块，大概如下： user ├── model │ └── user.ts | └── menu.ts |─
前端技术系列（一）Vue项目目录结构
wangchao4732的博客
05-16 2210
这只是一个简单的Vue项目目录结构示例，实际上，随着项目的复杂性增加和使用的工具和库的不同，目录结构可能会有所变化。Vue项目的目录结构通常是由Vue CLI（Vue命令行界面）生成的默认结构，它提供了一个基本的项目框架。通过将模板、脚本和样式集中在一个文件中，Vue文件提供了更高的可维护性和可读性，使得组件的开发更加方便和快速。：这是通过npm安装的第三方依赖库的目录，包含了项目所使用的所有依赖项。：这是存放可复用组件的目录，通常包含一些小型的、独立的Vue组件。
JavaEE项目的目录结构
weixin_34194087的博客
02-18 642
为什么80%的码农都做不了架构师？>>> ...
前端vite项目目录规范
07-13
在Vite项目中，通常可以遵循以下一般的目录规范： ``` - public/ # 公共资源文件夹 - src/ # 源代码文件夹 - assets/ # 静态资源文件夹（图片、样式等） - components/ # 可复用的组件文件夹 - views/ # 页面视图文件夹 - utils/ # 工具函数文件夹 - App.vue # 根组件 - main.js # 入口文件 - tests/ # 测试文件夹 - dist/ # 构建输出目录 - node_modules/ # 依赖模块文件夹 - package.json # 项目配置文件 - README.md # 项目说明文件 ``` 这是一种常见的组织结构，但可以根据项目的具体需求进行调整和扩展。下面是对每个目录和文件的简要说明： - `public/`：存放公共资源文件，如HTML模板、全局CSS等。 - `src/`：项目的源代码目录。 - `assets/`：存放静态资源文件，如图片、样式表等。 - `components/`：存放可复用的组件，每个组件通常包含一个`.vue`文件。 - `views/`：存放页面视图组件，通常以路由为单位进行组织。 - `utils/`：存放工具函数、辅助类或可复用的功能模块。 - `App.vue`：根组件，整个应用的入口。 - `main.js`：应用的入口文件，初始化应用并挂载根组件。 - `tests/`：存放测试文件，可以使用不同的测试框架来编写单元测试、集成测试等。 - `dist/`：构建输出目录，用于存放构建后的文件。 - `node_modules/`：存放项目的依赖模块。 - `package.json`：项目的配置文件，包含项目的依赖、脚本等信息。 - `README.md`：项目的说明文件，可以包含项目的介绍、使用方法等信息。 这只是一种常见的目录规范，具体的项目可能会根据需求和约定进行调整和扩展。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值