Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
From RequireJS to Webpack
Search
RIDI
November 03, 2017
Technology
3
820
From RequireJS to Webpack
발표자: 스토어팀 조규진
RIDI
November 03, 2017
Tweet
Share
More Decks by RIDI
See All by RIDI
원격 근무 팀 운영 경험 공유
ridi
0
2.2k
SVG Icon Design Guide
ridi
2
3.8k
빠르게 훑어보는 리디페이 백엔드 개발기
ridi
2
5k
Next.js는 정말 zero config였다.
ridi
0
2.1k
3일 걸릴 것 같던 구매목록 다운로드는 왜 3주가 걸렸을까?
ridi
0
440
원격으로 한 달 일해보니
ridi
0
1.4k
리디북스 앱에 S Pen Remote 연동하기
ridi
2
2.7k
UI 라이브러리 개발기
ridi
1
2.6k
테스트 환경 개선하기
ridi
8
3.5k
Other Decks in Technology
See All in Technology
Amazon ECS & AWS Fargate 運用アーキテクチャ2025 / Amazon ECS and AWS Fargate Ops Architecture 2025
iselegant
16
5.4k
Understanding_Thread_Tuning_for_Inference_Servers_of_Deep_Models.pdf
lycorptech_jp
PRO
0
110
Абьюзим random_bytes(). Фёдор Кулаков, разработчик Lamoda Tech
lamodatech
0
330
2年でここまで成長!AWSで育てたAI Slack botの軌跡
iwamot
PRO
4
690
データプラットフォーム技術におけるメダリオンアーキテクチャという考え方/DataPlatformWithMedallionArchitecture
smdmts
5
630
Witchcraft for Memory
pocke
1
290
M3 Expressiveの思想に迫る
chnotchy
0
100
Windows 11 で AWS Documentation MCP Server 接続実践/practical-aws-documentation-mcp-server-connection-on-windows-11
emiki
0
950
How Community Opened Global Doors
hiroramos4
PRO
1
120
~宇宙最速~2025年AWS Summit レポート
satodesu
1
1.8k
mrubyと micro-ROSが繋ぐロボットの世界
kishima
2
220
AWS Summit Japan 2025 Community Stage - App workflow automation by AWS Step Functions
matsuihidetoshi
1
250
Featured
See All Featured
Adopting Sorbet at Scale
ufuk
77
9.4k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Thoughts on Productivity
jonyablonski
69
4.7k
The Pragmatic Product Professional
lauravandoore
35
6.7k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.5k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Bash Introduction
62gerente
614
210k
Transcript
From RequireJS To Webpack झషয ઑӏ
• ݽٚ ݽٕ ੌ • ױਤ ࠂ ઁѢо ਬ܂
ঋ • ࢲ ࠽٘ೞ۰ݶ concat ೧ঠೠ (dependency ҅ X) • ࢜۽ بੑೠ Vue.js ਊ ಕח webpackਵ۽ ࠽٘ ⟶ ӝઓ ݽٕҗ ഐജ ө۽
• ݽٕ dependency ӝળਵ۽ ߣٜ • babel ١ নೠ loaderܳ
ా೧ ߣٜ җীࢲ ߸ഋ ਊ оמ webpack
߄Լࠁ~ 7 زউ ࢲ ݽٚ JS ࣻ
• Bower ઁѢ && webpack && ES6 زदী ਊ •
झప పझ݅ 3ߣ… ೧ب ೧ب ࠛউೣ • ߓನ റ উ٘۽٘ীࢲ ۽٘ ز ী۞ • webpack → Bower ઁѢ → ES6 ࣽਵ۽ ਊ೮ݶ?
• ݽٕਸ ղ ۽ • ES6
ߓನ റ
ҳ ߡ উ٘۽٘ জ, ۨ݃ ࠳ۄীࢲ झ݀ ز উ ೣ
• ES3ীࢲ ES ডযܳ foo.keyword, {keyword: ‘foo’} ৬ э ࢎਊೡ
ࣻ হ • ۨ݃ח উ٘۽٘ 4.0.x ੋؘ ES3 babel-polyfill VueJS
Babel plugin ਊ UglifyJSPluginীࢲ द quote ઁѢೞ ঋب۾ ২࣌ ୶о
• moduleIdо ҅ࣘ ߸҃غח ޙઁ • ࠽٘ റ ੌ ױਤ۽
ߓನೞח दझమ (ߣ deployer بੑ ) Ѣ ߓನೞח Ѣ ݏইਃ?
https://webpack.js.org/guides/caching/#module-identifiers
moduleIdী ࢚҃۽৬ hash ਊ webpack ࢸ ࠁ݅ vendors.webpack.js ܻ࠙
ৈ ࢚ ޅೠ ੌ ߸҃ؽ Ѣ ߸҃ػ Ѣ ݏইਃ? •
chunkIdب ҅ࣘ ߸҃
chunkIdب ܴਵ۽ ߸҃
None
• async import • ridibooks.com / static.ridibooks.com • xxx.dev.ridi.io •
config.local.php $STATIC_URL ଵઑ೧ࢲ webpack.local.js ࢤࢿ
• ಣӐ ࠽٘ दр 20s (Babel cache ਊػ ࢚క) •
۽ UglifyJSPluginীࢲ ো
࠙ݺ ҕध ޙࢲী parallel, cache ২࣌ חؘ..
• webpack ҕधޙࢲীࢲ п plugin repo README.md ࢎਊ • ߡ
ҙ҅হ ୭न ழਵ۽ оઉ১
߹ب ۞Ӓੋ ਊ 10ੌ ী UglifyJSPlugin v1.0.0 ܾܻૉ
• webpack ߣٜ݂ ٸޙী ѐߊ दীب sourcemap ਃ • cheap-module-eval-source-map
খਵ۽..
• ԇؘӝ݅ ES6ੋ ݽٕٜ refactor • VueJS ਊ ഛ (GNB,
࢚ࣁಕ दܻૉ ܻझ ١) • jQuery ୭ࣗച…. • ࣘੋ ѐߊജ҃ ѐࢶ
хࢎפ