아장아장 키보드소리 아장아장 키보드소리

1. deploy.yml 파일에서 ~~~ npm run install 로직 ~~~ - name: Cypress run uses: cypress-io/github-action@v2 ~~~ npm run build 로직 ~~~ 2. cypress.json "baseUrl":"https://githubName.github.io", 추가 ( githubName 자신의 github name으로 변경) 테스트 && 배포 성공!

deploy.yml 파일에서 - name: Cache node_modules uses: actions/cache@v1 with: path: node_modules key: ${{ runner.OS }}-build-${{ hashFiles('**/yarn.lock') }} restore-keys: | ${{ runner.OS }}-build-${{ runner.OS }}- 를 아래 코드로 변경하여 해결 - name: Cache node_modules uses: actions/cache@v2 with: path: | node_modules ~/.cache/Cypress build key: ${{ runner.OS }}-node_modules-build-${{ hashFiles('**/yarn.lock') }..

router/index.js import { createRouter, createWebHistory } from 'vue-router' createWebHistory -> createWebHashHistory 로 바꾼다. createWebHashHistory : 새로고침 시 주소창에 #이 추가 된다.. 아래 createRouter({ history: createWebHistory -> history: createWebHashHistory ()로 바꾼다 routes }) createWebHistory -> createWebHashHistory로 바꾸면 git pages reload 404 에러가 해결된다. 리로드 문제는 해결되지만 SPA만 사용한 git pages는 SEO에 걸리지 않는다고 한다.

.github/workflows/deploy.yml 생성하기 name: Deploy Project on: push: branches: - main jobs: update: runs-on: ubuntu-latest steps: - uses: actions/checkout@master - name: Set up Node.js uses: actions/setup-node@master with: node-version: 12.x - name: Cache node_modules uses: actions/cache@v1 with: path: node_modules key: ${{runner.OS}}-build-${{hashFiles('**/yarn.lock')}} restore-keys: | ${{ runner.O..

1. vue3 프로젝트를 create 한다. 2.github repogitory를 만들고 vue project와 remote한다. 3. vue.config.js 파일을 만들고 (경로 : '/' ) module.exports = { publicPath: process.env.NODE_ENV === 'production' ? '/깃헙 레파지토리 이름/' : '/' } 코드를 넣고 저장한다. 4.deploy.sh를 만들고 아래 코드를 붙여넣는다. ( 경로: '/' ) #!/usr/bin/env sh # abort on errors set -e # build npm run build # navigate into the build output directory cd dist # if you are deployin..

onetwo 의 스타일을 입히면 .container{ width:1000px; height: 500px; border:1px solid red; font-size:0; letter-spacing:0; word-spacing:0; line-height:0; } .item{ width:50%; height: 500px; border:1px solid black; display: inline-block; /* margin-right:-5px; */ margin: 0px; padding: 0px; font-size:5px; } 와 안맞아... 왜지?? 인터넷에 있는 방법들을 써봐도 해결 되지 않아서 결국 flex 또는 fload:left로 처리했습니다

main.ts ---------------------- import VueHtmlToPaper from 'vue-html-to-paper'; const options = { name: '_blank', specs: [ 'fullscreen=yes', 'titlebar=yes', 'scrollbars=yes' ], styles: [ "사용 중인 s3서버에 css파일을 배포 , 배포한 css의 주소를 사용" ] } Vue.use(VueHtmlToPaper, options); ----------------------------- 하지만 글씨체는 바꿔지지 않는 이상한 일을 경험했다.. 어디 물어볼 사람도 없고 ... 2시간 정도 방법을 찾던 중 드디어 해결 배포하는 css에 사용하고 싶은 글씨체를 @import..

회사 프로젝트의 table 목록 검색 기능을 test하던 중 이상한 점이 갑자기 너무너무 많이 생긴 느낌이었다.. date picker 부터 select list 등 원래 잘 작동하던 기능들도 동작이 이상하고 table에 목록을 가져와서 조건별로 검색을 할 시 data는 table에 잘 들어가는데 table에는 이상한 값들로 보이는 처음 겪어보는 이슈였다. DB부터 시작해서 apollo , table에 연결된 computed등을 전부 확인해 봐도 데이터는 정상적으로 들어오고 있었다. 하지만 table에서 이상한 값들이 보여졌다. 혼자 엄청 고생하면서 하나하나 고치고 있던 중 6시간이 눈깜짝한 사이에 흘러버렸고 팀장님과 이야기를 통해서 아주 아주 간단하게 해결했다. 바로 chrome에서 자동번역을 해주는 ..