Webpack4 + Babel7 + webpack-dev-server로 React 환경 만들기

비망록으로서 c⌒ﾟдﾟ)っφ　메모메모... Webpack4에서 webpack-cli 설치도 필요하게 된 것 같습니다. Babel7에서 core라든지 preset라든지 여러가지 인스톨 방법에서 바뀌었다babel-loader 만은 지금까지대로 그리고 이번에는 HtmlWebpackPlugin도 사용해 보겠습니다. 마지막으로 React @babel/register 를 넣으면 Webpack의 설정도 ...

babel자바스크립트webpack-dev-serverwebpack4

포트폴리오를 만들기 시작하고 무료로 공개 (Webpck4, Babel에서 ES6 → ES5로 변환)

의 계속입니다. 전회, Babel로 변환 후에, Chrome으로 열람시에 수수께끼 에러로 움직이지 않게 되어 버렸습니다만, 마침내 Chrome과 IE11 모두에서 움직였습니다! 한 일의 비망록을 적어 둡니다. 에러는 결국, jQuery 주위의 변환이 제대로 할 수 없었던 것이 원인인 것 같았습니다. 그 대책도 플러그인이었습니다. 설치한 Babel package.json .babelrc web...

자바스크립트es6webpack4babelHTML5

Webpack의 css loader에서 css 파일을 string형으로 변환하거나 CSS Modules적으로 취급할 수 있도록 한다.

nodejs(typescript)로 css를 이하와 같이 string형으로 쓰고 있었지만, .css 파일로 쓰는 것이 VSCode라든지로 css의 보완도 효과가 있을 것이다. . 라고 생각해, 실험해 보았습니다. css.ts hoge.ts 여러가지 방법을 구그 하고 있으면, webpack의 공식 문서로 이하와 같은 기술을 발견. (실장 방법 등은 후술) css-loader toString Y...

webpackTypeScriptwebpack4

포트폴리오를 만들기 시작해 무료로 공개한다(Webpack4 사용해 보았다)

의 계속입니다. 정적 웹 사이트를 만드는데 Webpack을 사용한 적이 없었습니다만, 지금 다시 사용해 보았습니다. SPA 만들 때 Angular CLI를 한 번 두드리는 것만으로 마음대로 온다 유익한 편리 도구라고 생각했으므로, 스스로 사용법을 찾은 적이 없었습니다. 애초에 정적 웹사이트를 만들 기회가 없었다. 그냥 며칠 전에 webpack 버전 4가 출시 된 것 같습니다. 조건은 없지만,...

HTML자바스크립트scsswebpack4포트폴리오