2020년 7월 2일 목요일

Vue.js 를 VSCODE 에서 디버그 하기(브레이크 포인트잡기)

Vue.js 를 VSCODE 에서 디버그 하기(브레이크 포인트잡기)

 js 는 브레이트포인트 잡는게 썅. 
 일단 Vue.js (이름참 좃같...) 의 작업을 한다.

"That basically acts as the magic goo that enables the rest of this to work." WTF NUXT!

https://github.com/in28minutes/spring-boot-vuejs-fullstack-examples
예제를 기준으로!

1.프론트쪽 폴더에서 npm run serve 실행
2.프론트쪽 폴더 선택후 VSCODE 에서 실행하면 launch.json 만들라고 하니까 만듬
3.런쳐는 크롬을 띄워서 디버그 해야 되니까 다음과 같이 입력

{
    "version": "0.2.0",
    "configurations": [
     {
        "type": "chrome",
        "request": "launch",
        "name": "[Debug] Vue.js: chrome",
        "url": "http://localhost:8080",
        "webRoot": "${workspaceFolder}/src",
        "breakOnLoad": true,
        "sourceMapPathOverrides": {
            "webpack:///src/*": "${webRoot}/*"
        }
      }
    ]
  }
4.브레이크 잡고 확인

어이없는 이런 방식이 맞는가 싶네...

참고.

https://medium.com/@changjoopark/visual-studio-code%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%9C-vue-js-%EC%95%B1-%EB%94%94%EB%B2%84%EA%B9%85%ED%95%98%EA%B8%B0-6a402fefafe

0 comments:

댓글 쓰기