# dynamic-import

oka1313

React 앱들은 번들링(Bundling)을 통해 HTML 웹 페이지에 JavaScript를 쉽게 추가할 수 있다.번들링된 앱은 모든 JavaScript 코드가 한 곳에 있으므로 페이지 설정을 위한 호출 수가 적어지고, 단일 링크 태그만으로 JavaScript를 추가할

qorgkr26

Dynamic Import란 자바스크립트 모듈을 필요할 때 불러오는 방식입니다.Javascript는 ECMAscript 표준으로 dynamic import를 다음과 같이 지원하고 있습니다.

app235naver

Nextjs에서react-simplemde-editor를 이용하여 Editor component를 만들고, props데이터로 Preview 기능을 옵셔널하게 바꾸려고 하였습니다.import 후 렌더링시 ReferenceError: navigator is not defi

zoo0

브라우저보다 Next.js에서 화면이 먼저 그려져서(pre-rendering) 생기는 에러이다.이것을 해결할 수 있는 방법은 세 가지가 있다.1\. useEffect2\. typeof3\. process.brower이렇게 해도 import 자체가 안되는 라이브러리들이

pikadev1771

React 앱들은 대부분 Webpack, Rollup 등을 이용해 번들링(Bundling)번들된 앱은 모든 JavaScript가 한 곳에 있기 때문에 링크 태그 하나만으로도 전달 가능but 브라우저(JavaScript 엔진)이 해석해야 하는 자바스크립트 코드의 양이 많

std1011

React.lazy 함수를 사용하면 dynamic import를 사용해 컴포넌트를 렌더링 할 수 있습니다.React는 SPA(Single-Page-Applicaion)이므로 한 번에 사용하지 않는 컴포넌트까지 불러오는 단점이 있기 때문에 React.lazy를 통해 컴포

sjyoung428

Nextjs를 공부하다가 Dynamic Import를 알게 되어 소개하려 한다위와 같이 클릭 이벤트를 통해 Left 컴포넌트와 Right 컴포넌트를 바꾸는 간단한 기능을 만들어 봤다그런데 분명히 console.log('hi')는 Right 컴포넌트가 있는 파일에 위치해

cloud_oort

이전에 다루었던 import와 export는 모두 정적인 방식이며, 문법이 단순하고 제약사항이 있다. 하지만 동적 가져오기를 사용하면 이를 해결할 수 있다.

kimareum

웹에디터 이해크로스사이드스크립트(XSS)OWASP TOP 10

maliethy

srcsrc.js/src/webpack.config.js/src/package.json/src/js/index.js/src/js/sub2.jsdist/dist/manifest.json/dist/index.html/dist/sub2.htmldistdist/jscss ba

bandor

https://tech.kakao.com/2020/12/01/frontend-growth-02/ 위 글에서 보면 commonJS와 ESModule을 함께 사용하기 위해서 @babel/plugin-transform-modules-commonjs, 즉 preset-env

byungjin0120

해킹의 위험성을 없앤상태로 React-Quill 에디터 라이브러리를 쓰는 방법을 설명

rimo09

Create-react-app으로 프로젝트를 만들어 환경설정을 하는 중, ie 지원을 위한 polyfill을 불러오는데, 모듈이 필요한 브라우저에서만 선택적으로불러오면 좋지 않을까하여 고민했던 방법을 정리합니다.