본문 바로가기

728x90
반응형

개발/Webpack

(2)
[Babel] CSS 설정법 Babel은 JavaScript를 사용하는 개발자들이 최신 JavaScript 구문을 사용하면서 구식 브라우저에서도 코드를 작동시킬 수 있게 해주는 도구입니다. CSS와는 직접적인 관련이 없지만, CSS 전처리기인 Sass, Less, Stylus와 같은 도구들과 함께 사용될 때 유용합니다. CSS 전처리기를 사용할 때, 브라우저는 이를 이해하지 못합니다. 따라서 CSS 전처리기를 사용하는 개발자들은 CSS 파일을 생성하기 위해 전처리기를 사용하고, 이 파일을 브라우저에서 사용합니다. 이때 Babel을 사용하면 전처리기에서 생성된 CSS 파일을 브라우저에서 사용 가능한 CSS 파일로 변환할 수 있습니다. Babel을 사용하여 CSS 파일을 변환하려면 다음 단계를 따르세요: Babel 설치하기: 먼저 Ba..
[Webpack] CSS 설정법 Webpack은 JavaScript 모듈 번들러로서, JavaScript, CSS, 이미지 등 모든 종류의 파일을 하나의 파일로 번들링할 수 있습니다. Webpack을 사용하여 CSS 파일을 번들링하려면 다음 단계를 따르세요: Webpack 설치하기: 먼저 Webpack을 설치해야 합니다. npm install --save-dev webpack webpack-cli 명령어를 실행하여 Webpack을 설치합니다. CSS 로더 설치하기: Webpack은 CSS 파일을 이해하지 못합니다. 따라서 CSS 파일을 로드하고 해석하기 위해 CSS 로더를 설치해야 합니다. npm install --save-dev style-loader css-loader 명령어를 실행하여 style-loader와 css-loader를..

728x90
반응형