我的商城前端项目迷思(架构搭建篇)

文章探讨了前端开发中的跨域解决方案,包括nginx配置、axios和jsonp。还介绍了yarn的使用以及项目构建的思考流程,如需求分析、页面路由规划和组件复用。同时,提到了vue的路由封装技巧和错误处理策略,以及webpack学习和环境变量配置。最后,讨论了通用模块的封装,如路由、cookie和storage,并强调了项目设计的重要性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.跨域的三种方法(nginx、axios、jsonp,ajax等等,还需要仔细查看)
2.yarn的用法https://neveryu.github.io/2018/07/20/yarn/
3.https://www.jianshu.com/p/58444afa75d6
吸烟刻肺,谢谢你,node版本
4.关于我要做项目,我要思考些什么:需求梳理
–熟悉文档,查看原型,读懂需求(有多少页面、有多少路由,有什么组件可以复用)
–了解前端设计稿,设计前端业务架构
–了解后台接口文档,制定相关对接规范
–协调资源
–搭建前端架构
不仅仅是做项目,平时画网页静态页面,也是从他的原型开始查看,对照他的结构进行开发
5.路由封装,子路由,路由封装

	1.定义路由: 
			根据设计稿,来设计页面、根据页面来确定路由,一个页面一个路由, 	
			但是:
	   		页面中有相同的可复用的底部或头部或可共用的部分,
	   		可以放在父路由中,其它页面放在子路由中,
	   		这样可减少代码量,
	   		如果没有可共用的地方,那就再建一个路由 		
	   		有的还有id等参数等,
	   		2.加载路由: 		
	   		以这些为顺序: 		
	   		home\main\router\nav-header\nav-footer\
	   		index\product\detail\
	   		order\cart\orderlist\ordercomfirm\orderpay\
	   		3.command D全选同类项
	   		4.全局搜索跳转很快的
	   		5.vue组件,项目里各个层级调用
  1.    return JSON.parse(window.sessionStorage.getItem(STORAGE_KEY) || '{}');
    

2.cookie、storage、
3.export default
4.网页控制台调试入门,各个模块的功能
5.在vue中命名的时候会遇到 component name “index“ should always be multi-word的解决方案:
在根目录下找到vue.config.js文件, lintOnSave:false

----2023.1.21
1.axios用法?
interceptor?
2.接口错误拦截?

3.接口请求拦截?
4.设置基础值?/api? defaults?
5.webpack 学习
6.process.env.NODE_ENV
nodejs
7.在做vue2项目时出现如下错误,页面空白且控制台出现如下错误:
Uncaught TypeError: Cannot read properties of undefined (reading ‘install’)
原因是vue-router版本太高,重新下载就可以了
yarn add vue-router@3.5.3

——————2023.1.22春节快乐!————
重要问题

一个H5或PC项目,应该具备哪些功能点?
通用模块应该如何封装?

关键点

后台管理系统和H5项目在形态上有很大差异,但是对于基础架构部分大有雷同,我们如何搭建通用架构?
很多工具库都是在开发过程前提前封装,我们应该如何封装路由、cookie、storage等模块

嗯…做项目,正式开发前的项目设计也是重要的,搭好架构事关重要;
见文:https://blog.youkuaiyun.com/grandPang/article/details/80050473
在这个项目中,我的架构考虑到了:
跨域、需求梳理、接口梳理、目录建立、路由封装、storage封装、使用的插件该装就装(具体看需求,推测可能使用到哪些插件)、接口错误拦截、接口环境设置、数据mock设置、

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值