프론트 개발 블로그

퍼블리싱 환경에서 Pug+SASS+Gulp 를 사용해 보일러플레이트 만들기 Pug(구 Jade) Pug 는 Node.js 및 브라우저용 JavaScript 템플릿 엔진이다. * 초기에 Jade 로 불려졌으나, 상표권 문제로 Pug 로 변경 Package $ npm install pug Syntax Option pug-lintrc.json 를 통해서 option 설정 가능 더보기 { "validateLineBreaks": "CRLF", //모든 줄 바꿈 문자는 일치해야 합니다. "disallowAttributeConcatenation": null, // Pug에는 속성 연결이 포함되어서는 안 됩니다. "disallowAttributeInterpolation": true, //Pug에는 속성 보간 연산자가 ..

Gulp 셋팅 다시 함. 이전 버전은 https://maybe-b50.tistory.com/26 파일 구조 dist node_modules src html index.html html_eng img sprite del.jpeg inc bottom.html footer.html header.html js ui.js lib scss component _base.scss _mixin.scss _var.scss vendor _sprite.scss style.scss .gitignore babel.config.js gulpfile.bable.js package-lock.json package.json README.md gulpfile.bable.js // gulpfile.bable.js const { series..

package.json 작성 중 나타난 에러 String does not match the pattern of "^(?:@[a-z0-9-*~][a-z0-9-*._~]*/)?[a-z0-9-~][a-z0-9-._~]*$". name 에 들어간 대문자때문에 생긴 에러였다. name 작성 할 때 대문자 그리고 띄어쓰기가 허용되지 않기 때문에 소문자로 작성하고 띄어쓰기는 '-' 하이픈으로 대체한다. 참고! package.json 파일에 NPM 규칙을 적용하기 위해 발생하는 에러라고 한다. stackoverflow.com/questions/48694816/vscode-package-json-string-does-not-match-the-pattern

Gulp 작업 환경 셋팅중에 만난 ReferenceError: primordials is not defined in node 구글링 검색해보니 이미 해결 방법이 나와있었다. nykim.work/70 Gulp3 버전은 Node 12 버전에서 제대로 동작하지 않는다고 한다. 방법1)Gulp4 로 업그레이드 하거나 방법2)Node 를 다운그레이드 하라는 방법이 나와 있는데 내가 사용하고 있던 작업 환경은 Gulp 3.9.1 / Node 14.15.4 였다. 방법3) 1. 기존에 있던 node_module 폴더 삭제 2. npm-shrinkwrap.json 파일 생성 후 동일한 디렉토리에서 코드 작성 : { "dependencies": { "graceful-fs": { "version": "4.2.2" } } ..

기본 Gulp 셋팅 #1. Check For Node, npm, and npx node, npm, npx 버전을 확인합니다. 설치가 되어 있지 않다면, 위의 해당 플랫폼과 패키지 관리자를 설치해줍니다. $ node --version $ npm --version $ npx --version #2. gulp-cli 유틸리티 설치 gulp-cli은 Gulp를 콘솔에서 편리하게 실행할 수 있게 해주는 유틸리티 도구입니다. $ npm install --global gulp-cli #3. 프로젝트 디렉토리 생성 후 해당 디렉토리로 이동 $ npx mkdirp my-project $ cd my-project #4. 프로젝트 디렉토리에 package.json 생성 $ npm init #5. gulp package 설치..