공부/javascript

2022.02.27 - npm nvm / vscode 이용 github 버전관리 (+port 오류 )

기묜몬 2022. 2. 27. 15:54

pacel bundler / lodash 

1) -d, -- (개발용 의존성 패키지 설치) :  설치한 패키지들이 개발할때만 사용하고, 웹브라우저에서는 동작하지않음.

2) - 붙이지 않는 경우 (일반 의존성 설치) : 웹브라우저에서도 동작할 수 있는 개념이라고 선언하는 것. 

 

- npm run build : 사용자들이 볼 수 있는 화면 빌드 명령어 

명령어 실행 하면 dist라는 폴더가 생김, 

그 안에 index.html 열어보면 코드가 기존 모양과 다르게 가로로 길게 작성되어있음.

이것을 코드 난독화 라고 한다. 

 

- 코드 난독화 :  작성된 코드를 읽기 어렵게 만드는 작업, 

빌드된 결과는 브라우저에서 해석되는 용도로, 용량을 축소하고 읽기 어렵게 만드는 등의 최적화를 거치는 것이 좋다. 

 

** 앞으로는 open with live server로 브라우저를 열지 않고, 

package.js 에 명시한 개발용 서버를 열어주는 명령을 통해 (npm run dev)

브라우저에 출력해서 개발을 진행하도록 할 것.

 

- 유의적 버전 (semver)

 ex) node --version 입력시 v16.14.0 버전임을 알 수 있고, 세 개의 숫자를 확인할 수 있다. 

숫자의 의미 : 

Major(16). Minor(14). Path(0)

Major : 기존 버전과 호환되지않는 새로운 버전  (v16, v17..등 새롭게 업데이트되는 새로운 버전)

Minor : 기존 버전과 호환되고, 새로운 기능이 추가된 버전 (v16이 14번이나 새로운 기능이 추가된 버전인 것 )

Path : 기존 버전과 호환되고, 버그 및 오타등 세세한것이 수정된 버전. (1. 0 ...)

 

npm info lodash : npm을 통해서 lodash 의 정보를 확인하겠다. 는 명령어 

latest :  최신버전을 의미 (4.17.21)

 

 

[ git. 버전관리 ]   / vscode 를 사용 

버전관리 하지않을 파일 선언 

1. ( .gitignore)파일 생성 

.cache/

dist/

node_modules/ 

입력 후 저장 

 

2. 터미널 git init  입력

-> 왼쪽 파일에 U표시됨 / 표시되지 않은 것들은 버전관리에서 무시하려고 선언된 부분임을 확인. 

 

3. git status 

-> 변경사항이 추적되지 않는 부분들이 나옴 

 

4. git add . 

-> 버전을 만들기 위한 명령어 

 

5. git status

-> 버전을 만들기 위해 추적된 것들을 다시 추적 

 

6. git commit -m '프로젝트 생성' 

-> 깃 버전 생성 

 

7. git log

-> 버전 확인 

 

8. 깃허브 페이지 접속 your repositories 새로운 저장소 생성 (test)

( 저장소 주소 복사 )

 

9. 터미널 git remote add origin 저장소 주소

-> 원격 저장소 연결 

 

 10. git push origin master 

-> 원격 저장소에 push 진행 

 

11. 깃허브 페이지 확인하면 커밋된 것을 확인할 수 있음 !! 신기하다

 

12. 저장소 삭제 

  settings -> dangerzone -> delete this repository -> 깃헙저장소 이름 input에 입력 후 삭제 ~!

 

+ 흠.. 깃ㅎ연결 해제를 안해서 그런지 갑자기  port 오류 떴다..

검색해서 해결~~!

 

https://velog.io/@dum6894/Git-%EC%9B%90%EA%B2%A9-%EC%A0%80%EC%9E%A5%EC%86%8C-%EC%97%B0%EA%B2%B0-%EB%81%8A%EA%B8%B0-git-remote