Angular项目结构最佳实践

Best Practice Recommendations for Angular App Structure

Proposal:

Changeangularseed,yeoman/generatorangular,(theGoogleinternalexample

go/nghellostyle),andotherdemoappstomodelthefollowingdirectorystructure.

Eventually,developtoolingtomakedevelopmentmoreefficientusingassumptionsbased

ontheseconventions.

Motivation:

Ourtoyanddemoappscurrentlygroupfilesfunctionally(allviewstogether,allcss

together,etc...)ratherthanstructurally(allelementsofaviewtogether,allcommon

someusecaseexamples.



Formoreonmotivationandtheneedforarecommendationofsomekind,seethis

lengthydiscussionhttps://github.com/yeoman/generatorangular/issues/109

Why a fractal hierarchy?

Wewantedtobeabletocreateacommonsetofrulesthatcanbeappliedtoalogical

unitwithinanapplication.Theapplicationdevelopercanthendecidehowmanylogical

unitsarenecessary,andapplytherulestoalloftheminthesameway.Thismakesit

easierforlargeapplicationstodevelopastructurethatreflectstheapplicationitself,while

applyingthesamerulesateachlevelofthehierarchy.

○ It'sfairlycommonnowtohavethesamenameusedfordifferentkindsof.jsfiles

aServiceandaFilterbothusingthesamename,forexample.Whenediting

filesinanIDEitcanbehardataglancetotellwhichiswhich.Addinganaming

conventionfortypesoffileshelpstoresolvethis.

○ Therearecurrentlymultiplewaysoforganizingbyextensionornaming

convention.Unittests,forexample,arenamed*_test.js,*.spec.js,ortest/*.js,

dependingonwhowrotethecode.Havingasinglerecommendationmakesit

easiertodeveloptools.