Socket.io-client: package.json์˜ ์ž˜๋ชป๋œ "main" ๊ฐ’์œผ๋กœ ์ธํ•ด IE 11 ๋กœ๋“œ๊ฐ€ ์ค‘๋‹จ๋จ

์— ๋งŒ๋“  2020๋…„ 02์›” 20์ผ  ยท  6์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: socketio/socket.io-client

์›ํ•˜๋Š” ์ž‘์—…:

  • [x] ๋ฒ„๊ทธ ๋ณด๊ณ 
  • [ ] ๊ธฐ๋Šฅ ์š”์ฒญ

ํ˜„์žฌ ํ–‰๋™

์‹ค์ œ๋กœ ๋ฌด์Šจ ์ผ์ด ์ผ์–ด๋‚˜๊ณ  ์žˆ์Šต๋‹ˆ๊นŒ?

๋‹ค์Œ์„ ์‚ฌ์šฉํ•˜๋Š” ๊ณต์‹ ์˜ˆ:

import io from 'socket.io-client';

JS ์•ฑ์—์„œ IE 11์—์„œ ๊นจ์ง„ ์‚ฌ์ดํŠธ๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค.

๊ณ ์žฅ๋‚ฌ๋‹ค๋Š” ๊ฒƒ์€ socket-io ๊ธฐ๋Šฅ์ด ์ž‘๋™ํ•˜์ง€ ์•Š๋Š”๋‹ค๋Š” ์˜๋ฏธ๊ฐ€ ์•„๋‹ˆ๋ผ ์˜ค๋ฅ˜ ๋ณด๊ณ  ๋“ฑ์„ ํฌํ•จํ•˜์—ฌ ์ „์ฒด ์›น ์•ฑ ๋ฒˆ๋“ค ๋กœ๋“œ๋ฅผ ์ค‘๋‹จํ•œ๋‹ค๋Š” ์˜๋ฏธ์ž…๋‹ˆ๋‹ค. IE 11์—์„œ ์•„๋ฌด๋„ ํ…Œ์ŠคํŠธํ•˜์ง€ ์•Š์•˜๊ธฐ ๋•Œ๋ฌธ์— ์•„๋งˆ๋„ ์•„๋ฌด๋„ ์ด ๋ฒ„๊ทธ๋ฅผ ์•Œ์•„์ฐจ๋ฆฌ์ง€ ๋ชปํ–ˆ์„ ๊ฒƒ์ž…๋‹ˆ๋‹ค.

์žฌํ˜„ ๋‹จ๊ณ„(ํ˜„์žฌ ๋™์ž‘์ด ๋ฒ„๊ทธ์ธ ๊ฒฝ์šฐ)

์›น ์•ฑ์— import io from 'socket.io-client' ๋ฅผ ์ถ”๊ฐ€ํ•˜๊ณ  IE 11์—์„œ ํ…Œ์ŠคํŠธํ•˜์‹ญ์‹œ์˜ค.

์˜ˆ์ƒ๋˜๋Š” ํ–‰๋™

๋ฌด์—‡์„ ๊ธฐ๋Œ€ํ•ฉ๋‹ˆ๊นŒ?

IE 11์€ ๋ฒˆ๋“ค์„ ๋กœ๋“œํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

์„ค์ •

  • ์šด์˜ ์ฒด์ œ: ์Šน๋ฆฌ 10
  • ๋ธŒ๋ผ์šฐ์ €: IE 11
  • socket.io ๋ฒ„์ „:

๊ธฐํƒ€ ์ •๋ณด(์˜ˆ: ์Šคํƒ ์ถ”์ , ๊ด€๋ จ ๋ฌธ์ œ, ํ•ด๊ฒฐ ๋ฐฉ๋ฒ• ์ œ์•ˆ)

์ด๊ฒƒ์ด ๋ฐœ์ƒํ•˜๋Š” ์ด์œ ๋Š” package.json์˜ "main" ๊ฐ’์ด ๋ฒˆ๋“ค๋œ dist ํด๋”๊ฐ€ ์•„๋‹ˆ๋ผ ๋ฒˆ๋“ค๋˜์ง€ ์•Š์€ ์†Œ์Šค ์ฝ”๋“œ๋ฅผ ์ง€์ •ํ•˜๋ฏ€๋กœ ์†Œ์Šค ์ฝ”๋“œ๊ฐ€ ๋ฒˆ๋“ค๋กœ ์ง€์ •๋˜๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. ์•„๋งˆ๋„ ์ผ๋ถ€ ๋ฒˆ๋“ค๋Ÿฌ๋Š” ๊ฐ€์ ธ์˜จ ๋ชจ๋“ˆ์„ ์ฒ˜๋ฆฌํ•˜์ง€๋งŒ ๋‚ด ๋ฒ„์ „์˜ Webpack์€ ์ฒ˜๋ฆฌํ•˜์ง€ ์•Š๊ณ  ์‚ฌ์šฉ์ž์˜ ์†Œ์Šค ์ฝ”๋“œ๋งŒ ์ฒ˜๋ฆฌํ•ฉ๋‹ˆ๋‹ค.

์†”๋ฃจ์…˜์€ dist ํŒŒ์ผ ์ค‘ ํ•˜๋‚˜๋ฅผ "main" ๊ฐ’์œผ๋กœ ์ง€์ •ํ•˜๋Š” ๋งค์šฐ ๊ฐ„๋‹จํ•ฉ๋‹ˆ๋‹ค.

ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์œผ๋กœ ์ž‘๋™ํ•˜๋Š” ๋‹ค์Œ ์ค„์„ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

import io from 'socket.io-client/dist/socket.io.slim.js'

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์€ ์ €์—๊ฒŒ๋„ ํšจ๊ณผ์ ์ž…๋‹ˆ๋‹ค. ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!

๋ชจ๋“  6 ๋Œ“๊ธ€

๊ฐ™์€ ๋ฌธ์ œ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์€ ์ €์—๊ฒŒ ํšจ๊ณผ์ ์ž…๋‹ˆ๋‹ค :+1:

์ข‹์€!

ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์€ ์ €์—๊ฒŒ๋„ ํšจ๊ณผ์ ์ž…๋‹ˆ๋‹ค. ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!

๊ทธ๊ฒƒ์€ ๋‚˜์—๊ฒŒ๋„ ํšจ๊ณผ๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. Good Job. @hyperknot ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!!

๋‹ค๋ฅธ ์‚ฌ๋žŒ๋“ค์ด ์•Œ ์ˆ˜ ์žˆ๋„๋ก ์ฝ˜์†”์— ์žˆ์Šต๋‹ˆ๋‹ค.
image

debug ์ข…์†์„ฑ์ด 3.1.0 ๋กœ ๋˜๋Œ์•„๊ฐ”์œผ๋ฉฐ, ์ด๋Š” ๋ณ€ํ™˜ํ•  ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค. 2.3.1 ์—์„œ ์ถœ์‹œ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

๋””๋ฒ„๊ทธ ์ข…์†์„ฑ์— ๋Œ€ํ•œ ํ˜ธ์ถœ์„ ์ œ๊ฑฐํ•˜๊ธฐ ์œ„ํ•ด webpack-remove-debug ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ์‚ฌ์šฉํ•  ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค( ์žˆ๊ฑฐ๋‚˜ ์—†๋Š” ๋นŒ๋“œ๋ฅผ ์ œ๊ณตํ•˜๋Š” ์ ์ ˆํ•œ ๋ฐฉ๋ฒ•์„ ์ฐพ์„ ๋•Œ๊นŒ์ง€).

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰