Vue Hellow World찍다.

1. 구글창을 띄운다.

2. Vue Hellow World로 검색한다.

3.그냥 다 나온다. ㅋㅋ

vue cli설치했고 webpack도 설치 했다

설치와 hellow world를 찍는건 정말 너무나도 쉽다.

npm이 알아서 다 해주니까 하지만 이 다음부터다 내가 고심했던건 정말 아주 사소한 부분이었으니까

처음 부터좀 알려주면 안되나 싶어서 적어본다.

자 보자

제일 고민 했던게 처음에 router? 이건 뭐야 y/n 뭘 선택 해야 하지 router저거 Y안하면 나중에 src밑에 폴더 설치하고 js파일 만들고 손이좀 간다

ESLint y/n 나중에 알았는데 아 이거 했을때 짜증나 죽는줄 알았다... 띄워쓰기 부터 시작해서 막말고 // 이거 쓰는 것까지 아주 그냥 소스품질 체크 하는건데 적응 하기 힘들었다... 하지만 나 오늘 처음이오~~~ 하면 N를 1주일정도 됐다 싶으면Y를 눌러라 그래야 다른 프로젝트 나갔을때 고생 안한다.

set up unit tests, e2e tests이건 테스트 할때 쓰는거라고 하는데 ㅡ.ㅡ 한번도 해본적은 없다. 어디선가는 쓰겠지만 신경뚝

다음 설치할 명령어를 선택한다. 아마도 99%는 node가 설치되었겠지 ? 맞는거 선택하고 Enter꾹 선택 방법은 방향키로 위아래 움직여서 선택해보자.

자 만들어졌다. 설명이 잘 나와있다 저대로 실행 시키고 localhost:8080가면 Vue Hellow World가 나온다.

이제 폴더구조좀 보고 이야기좀 합시다.

Build 이곳은 webpack 관련된 파일들이 들어있다. 나중에 이런 글 안찾아볼 정도 실력되면 구글검색해서 심도 있게 찾아보자

Config 여기에서 볼 만한 것은 index.js이다 내가 8080포트 사용중이다 포트를 바꾸고 싶다면 여기들어가서 바꾸고 싶은 포트로 변경하면 된다.

다음은 모듈이 설치된곳 설치될곳인 node_modules다 여기에 사용 하다가필요한 모듈이 발생 한다면cmd창에 해당 프로젝트 폴더로 들어가서 MT-TEST폴더로 가서        npm install --save 모듈이름 하고 설치하면 node_modules로 들어간다.

다음은 package.json과 packge-lock.json이다 이건 설치 설정이 들어가 있는 폴더이다. packge.json이 있다면 아무 프로젝트를 만들고 저 json을 복사해 붙여놓고 cmd에서 npm install만 해주면 packge.json에 설정된 모듈 모듈들이 자동 설치된다. 해당 파일을 열어보면 설치한 모듈들이 쭉 나열된걸 볼수 있다. 그리고 packge-lock는 다른곳에서 자동으로 설치를 막아준다. 해당 json에 설정이 안되어 있다면 packge.json에 모듈을 강제로 추가했더라고 설치 안된다. 그러니 다시금 설치하고 싶다면 packge-lock.json을 삭제하고 npm install를 해줘야 한다.

폴더구조는 다음에 처음 배우면서 나만 궁금했던거 말해본다.