Reactjs和redux从入门到放弃，删库跑路的例子我看到有些初学者遇到了各种各样的问题。我还使用反应框架。公司是腾讯、阿里、平安的合资公司。它们是上海、深圳、杭州、北京和广州。多个分支有近百名前端人员，框架也向React看齐。我也在实际项目中使用了很长时间。和很多社区的新小伙伴一样，在入坑的过程中，遇到过各种各样的问题，这里就不一一详细吐槽了。如果你吐出来，你可能会说我疯了。下面重点介绍一下我们项目的整个框架结构，因为很多小伙伴在上手之后，在开始做一个项目的时候，都会发愁项目结构怎么搭建，方便后期维护，项目迭代等；地址：github项目示例地址，觉得不错记得帮忙转发和star，谢谢支持。项目结构示例：可以扫码预览以上是项目的大致结构。有兴趣的朋友可以进入项目详细看看。1、首先，我们会划分不同的环境，编写不同的配置文件，方便清晰的结构和维护。调整;2.所有项目组件都放在页面中，项目结构按页面中的项目模块划分。动作和减速器也是如此。共享组件放在components里面，路由文件也是按照工程模块来划分的。不要全部放在一个文件里，查找起来很不方便，也不好维护。4.将它们导入到一个条目文件中，并将它们导出到外部世界。5.实现按需加载和常用代码提取。6.本项目主要用到了react,react-router,redux,redux-thunk,es6,babel,webpack,node,express,fetch等7.特别是window.devToolsExtension是redux的调试工具.在chrome浏览器应用商店搜索redux后，点击Installed，开发环境可以看到redux状态变化的每一步，方便调试，提高开发效率；8、当然还有其他的，就不一一解释了。可以进入项目细看，/server/config.jsvardev=require('./env/dev'),test=require('./env/test'),pre=require('./env/pre'),prd=require('./env/prd');vardefaults={root:path.normalize(__dirname+'/..')};module.exports={dev:extend(dev,defaults），测试：扩展（测试，默认），预：扩展（预，默认），prd：扩展（prd，默认）}[process.env.DEPLOY_ENV||'开发'];//DEPLOY_ENV是node服务器环境变量路由文件也是按项目模块划分/src/pages/route.jsimportReactfrom'react';importReactDOMfrom'react-dom';import{Provider}来自“react-redux”；从“history/lib/useBasename”导入useBasename；从“react-router”导入{hashHistory、browserHistory、Router}；从“src/store”导入Store；从“src/”导入bridgeutils/bridge'constrootRoute={path:'/',component:require('../components/app/App'),childRoutes:[require('./Home/route'),//引入不同模块的·由require('./Intro/route'),require('./Handler/route'),require('./Setting/route'),{path:'*',getComponent(location,cb){require.确保([],(require)=>{cb(null,require('./NotFoundPage'));});},onEnter:()=>bridge.doAction('setTitle',{title:'出错啦'})//onEnter:()=>bridge.doAction('setWechat')}],indexRoute:{onEnter:(nextState,replace)=>replace('/home')},//默认重定到->首页};从"redux"导入{createStore,applyMiddleware};从"redux-thunk"导入thunk;从"导入reducer"src/reducers";functionconfigStore(){让createStoreWithMiddleware=applyMiddleware(thunk)(createStore);//开发环境启用redux调试letstore=createStoreWithMiddleware(reducers,(__DEBUG__&&window.devToolsExtension?window.devToolsExtension():undefined));returnstore;};exportdefaultconfigStore();地址：Github项目示例地址，如果觉得不错，对你有帮助，记得转发和star，谢谢支持想了解我吗？还有疑问？请戳这里，记得关注我们的公众号哦！作者：苏南-首席填坑官交流群：912594095，公众号：honeyBadger8本文为原创，版权归作者所有。商业转载请联系@IT·平头哥联盟获得授权。非商业转载请注明原文链接和出处。
