킹바구니

crbug/1173575, non-JS module files deprecated. 이와 같은 에러가 뜨며 되지 않는다면 launch.json을 이렇게 바꿔주면 된다. 1. launch.json 파일 수정 { "version": "0.2.0", "configurations": [ { "type": "chrome", "request": "launch", "name": "localhost에 대해 Chrome 시작", // "url": "http://localhost:8080", // "webRoot": "${workspaceFolder}" "file": "${workspaceFolder}/index.html" } ] } url, webRoot는 주석처리하고 file 부분을 다음과 같이 써주면 된다.

failed to execute command: null/Error: spawnSync git ENOENT (이건 git bash안깔아서 생기는 오류) your current branch 'master' does not have any commits yet (이건 계정 한번 등록해야함) 아니 오픈소스 한번 받아서 보려는데 아무리 npm run start해도 안되길래 도대체 뭐지 하다가 생각해보니... 깃을 깔지 않았었다.... 1. git bash 설치 https://git-scm.com/downloads Git - Downloads Downloads macOS Windows Linux/Unix Older releases are available and the Git source repository is..

할꺼 많다... 배울꺼 많다... 그래서 나중에 바로 꺼내서 보게 글쓴다... 일단 타입스크립트를 연습할 수 있는 사이트를 켜놓고 시작하자. 참고로 console.log()가 왜 안되지라고 한다면 상단에 있는 run을 눌러주면 나온다(run안눌러도 에러 잡아주길래 자동으로 run해주는줄 알았음). https://www.typescriptlang.org/ JavaScript With Syntax For Types. TypeScript extends JavaScript by adding types to the language. TypeScript speeds up your development experience by catching errors and providing fixes before you eve..

canvas는 그림을 그리는데 사용되는 html 태그임. 단순 이미지가 아닌 그래프, 사진, 애니메이션 등을 구현할 수 있음. 이 포스팅에 기본적인 canvas 구현법을 정리해둠. 1. canvas에 width, height 설정하기 html 또는 js 둘중 하나로만 설정해야함. css로 설정하면 canvas 내에 도형을 그렸을때 렌더링이 이상하게 됨 (css 속성과 실제 width/height는 다른 개념이라서 깨지는것). const canvas = document.querySelector('canvas'); canvas.width = 500; canvas.height = 700; 2. canvas에 background 채우기 background 정도는 css로 해도 문제가 없지만 기본적으로 canva..

https://start.spring.io/ 스프링 하는 사람들은 다들 스프링부트로 프로젝트를 만드는데, 그 스프링부트 프로젝트를 기본적으로 만들어주는 간편한 사이트임(공식) 1. 파일 받기 아주 빠르게 설정한다면 위에 노란색 박스 부분들만 선택하면 된다. 보통 gradle로 많이들 한다길래 gradle로 설정하고, 언어는 자바, 스프링부터 버전은 제일 최신(snapshot은 개발버전같은거라 패스), 자바 버전은 11을 쓰기때문에 11로 변경, 필요 라이브러리는 스프링웹과 타임리프 기본적으로 쓰니까 두개 추가. 그리고 하단에 generate 버튼을 누르면 된다. 2. 압축 해제 후 이클립스 실행 보통 공부한다고 강사껄 따라서 고대로 하다보면 이 위치에 workspace폴더가 있는데 C:\Users\본인컴..

하 진짜 아무리 방법을 읽어봐도 메뉴 이름도 보이지도 않고 안그래도 예전에 엄청 이리갔다 저리갔다 한게 기억나서 머리가 아파가지고 열받아 죽을라하다가 언어를 영어로 바꿔도 보고 하다가 겨우 찾아서 정리할겸 씀. how to delete facebook account 1. 로그인 후 우측 상단 프로필 - 설정 및 개인정보 클릭 login > click the profile an the top right section > click Settings & privacy 2. 설정 클릭 click Settings 3. 좌측 계정 센터 - 개인정보 클릭 click Personal details on Account center section at the top left. 4. 개인정보 클릭 계정센터에 들어와서 한번 ..

swiper의 webcomponent를 활용하여 슬라이드를 구현하고 있었는데 슬라이드 앞뒤이동 버튼 색만 변경하려고하는데 !important를 줘도 아무리 안먹어서 뒤져보다가 정리함. 1. injectStyles 활용 먼저 html태그 swiper-container에 ref를 설정해주고 init값을 false로 둬야함. 그리고 watch에 ref가 들어왔을때 위와 같은 코드를 넣어주고 initialize()를 해주면 잘 적용된다. 참고로 onMounted는 안먹히니께 주의! 이게 공식 설명서에 있긴한데 묘하게 빠진 부분이 있어서 안먹힌단말이지..

ionic 아이오닉이라고 안드, 아이폰같은 동작을 지원하는 웹앱 툴킷인데(react, vue같은 웹 프로젝트를 앱 형식으로 말때 사용), 제스쳐를 사용하고 싶은데 gesture.enable()만 하면 자꾸 아래와 같은 오류가 떠서 짜증났는데 답은 다음과 같다. 아니 공식예시문서에는 마운트 코빼기도 안보이더니~~~~~ Cannot read properties of undefined (reading '__zone_symbol__addEventListener') 1. onmounted 이후 작성 const viewRef = ref(); onMounted(() => { const gesture = createGesture({ el: viewRef.value, onMove: (ev) => onMoveHandler..

Failed to resolve component: swiper-slide Failed to resolve component: swiper-container swpier.js는 vue, react 버전 가이드를 따로 제공하는데 그대로 따라하다가 어느순간 보니 해당 버전들은 앞으로 버전에서는 삭제될테니 web component 형태로 쓰라고 하더라. 근데 자꾸 저 경고창이 뜨는데다 구글에서는 방법도 안나와서 발동동하다가 찾아냄. 1. vite 설정 변경 export default defineConfig(({ mode }) => { return { plugins: [ vue({ template: { compilerOptions: { isCustomElement: (tag) => tag === "swiper-..

원래 공식문서에서는 swiper.slideNext() 이렇게 쓰면 된다는데 안되는 이유가 뭘까 vue3이라서 그런가 아무튼 다른 방법을 찾아보았음. 1. swiper에 ref 걸어서 swiper가져오기 다음 const swiperRef = ref(); const slideNext = () => { // ref요소를 탐색해서 메소드 호출 swiperRef.value.$el.swiper.slideNext(); };