'FrontEnd' 카테고리의 글 목록 (16 Page)

로컬 호스트(localhost) 에서 REST API를 이용, Axios 를 이용, Ajax를 이용하는데에 있어서 CORS 에러가 자주 발생한다.

이 방법은 localhost 에서 발생하는 CORS 오류를 막는 것이다.

(만약 PUBLIC 으로 배포하였을 때에는 해당되지 않는다.)

Moesif Origin & CORS Changer

This plugin allows you to send cross-domain requests. You can also override Request Origin and CORS headers.

chrome.google.com

구글 크롬 extension의 CORS Changer를 사용하면 단번에 해결이 된다.

[ 다운로드 - 확장 - 새로고침 ]

이 세 단계로 모두 해결된다.

REST API - AXIOS 를 사용하는데에 자꾸 localhost에서만 해당 api를 가져올 수 없다고, CORS 에러가 발생하길래 어쩔 수 없이 사용하였다.

해당 내용처럼 잘 출력된다. 하지만 로컬에서는 안됐다는 점..

■ 에러내용

Access to XMLHttpRequest at 'request url' from origin 'http://localhost:8081' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

[ Vue.js ] 유튜브 강의 - 반응형 포트폴리오 만들기 (0)	2021.12.09
[ Vue.js ] methods , computed 안에서 함수 호출하는 방법 (0)	2021.11.22
[ Vue.js ] daum 주소 api 사용하는 방법 (예제 example) (0)	2021.11.18
[ Vue.js ] Axios - PHP, 200 response를 Error로 보내는 방법 (0)	2021.11.18
[ Vue.js ] Axios - post - php 데이터 송신방법 \| REST API \| 다른 포트 번호 에서 데이터 송수신 (1)	2021.11.12

[ 사용 환경 : Vue.js, tailwind css ]

Vue.js 에서 daum address api (kakkao map) 를 사용하는 방법을 포스팅 하겠습니다.

기존 html css js 에서 사용하는 것과 달리 조금은 번거로운 작업이 존재합니다.

Daum 우편번호 서비스

우편번호 검색과 도로명 주소 입력 기능을 너무 간단하게 적용할 수 있는 방법. Daum 우편번호 서비스를 이용해보세요. 어느 사이트에서나 무료로 제약없이 사용 가능하답니다.

postcode.map.daum.net

위 링크를 통해 실제 예제가 존재합니다. 이를 변형하여 vue에 맞게 제작하겠습니다.

팝업(pop up)을 이용한 웹 (Web application) 전용으로 제작하도록 하겠습니다.

■ 작업 순서

1. index.html
2. component 생성
3. component import

1. index.html 파일에서 cdn 연결해주기

<script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>

위의 내용을 복사해서 <head></head> 에 작성해주세요.

2. component 생성

이제 해당 내용을 작성할 컴포넌트를 생성하도록 하겠습니다.

src/views/Account/Address.vue 파일을 생성하였습니다.

Address.vue

<template>
    <div class="text-md my-5">
        <label class="text-xs px-2" for="company_name">회사주소</label><br> 
        <input class="focus:outline-none focus:ring focus:border-blue-600 border-b-2 border-black pt-2 px-2 mb-3 mr-10"  
            type="text" id="sample4_postcode" name="post_number" placeholder="우편번호">
        <button class="border-2 border-gray-400 rounded bg-gray-100 p-1 inline-block"
            type="button" @click="addressApi">우편번호 찾기</button><br>

        <input class="mr-10 focus:outline-none focus:ring focus:border-blue-600 border-b-2 border-black pt-2 px-2 mb-3"   
            type="text" id="sample4_roadAddress" name="address1" placeholder="도로명주소">
        <span id="guide" style="color:#999;display:none"></span>
        <input class="focus:outline-none focus:ring focus:border-blue-600 border-b-2 border-black pt-2 px-2"   
            type="text" id="sample4_extraAddress" name="address3" placeholder="참고항목">
        <input class="focus:outline-none focus:ring focus:border-blue-600 border-b-2 border-black pt-2 px-2"   
            type="text" id="sample4_detailAddress" name="address4" placeholder="상세주소">
    </div>
</template>

<script>
export default {
    methods: {
     addressApi() {
        new daum.Postcode({
            oncomplete: function(data) {
                // 팝업에서 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분.

                // 도로명 주소의 노출 규칙에 따라 주소를 표시한다.
                // 내려오는 변수가 값이 없는 경우엔 공백('')값을 가지므로, 이를 참고하여 분기 한다.
                var roadAddr = data.roadAddress; // 도로명 주소 변수
                var extraRoadAddr = ''; // 참고 항목 변수

                // 법정동명이 있을 경우 추가한다. (법정리는 제외)
                // 법정동의 경우 마지막 문자가 "동/로/가"로 끝난다.
                if(data.bname !== '' && /[동|로|가]$/g.test(data.bname)){
                    extraRoadAddr += data.bname;
                }
                // 건물명이 있고, 공동주택일 경우 추가한다.
                if(data.buildingName !== '' && data.apartment === 'Y'){
                   extraRoadAddr += (extraRoadAddr !== '' ? ', ' + data.buildingName : data.buildingName);
                }
                // 표시할 참고항목이 있을 경우, 괄호까지 추가한 최종 문자열을 만든다.
                if(extraRoadAddr !== ''){
                    extraRoadAddr = ' (' + extraRoadAddr + ')';
                }

                // 우편번호와 주소 정보를 해당 필드에 넣는다.
                document.getElementById('sample4_postcode').value = data.zonecode;
                document.getElementById("sample4_roadAddress").value = roadAddr;

                // 참고항목 문자열이 있을 경우 해당 필드에 넣는다.
                if(roadAddr !== ''){
                    document.getElementById("sample4_extraAddress").value = extraRoadAddr;
                } else {
                    document.getElementById("sample4_extraAddress").value = '';
                }

                var guideTextBox = document.getElementById("guide");
                // 사용자가 '선택 안함'을 클릭한 경우, 예상 주소라는 표시를 해준다.
                if(data.autoRoadAddress) {
                    var expRoadAddr = data.autoRoadAddress + extraRoadAddr;
                    guideTextBox.innerHTML = '(예상 도로명 주소 : ' + expRoadAddr + ')';
                    guideTextBox.style.display = 'block';

                } else if(data.autoJibunAddress) {
                    var expJibunAddr = data.autoJibunAddress;
                    guideTextBox.innerHTML = '(예상 지번 주소 : ' + expJibunAddr + ')';
                    guideTextBox.style.display = 'block';
                } else {
                    guideTextBox.innerHTML = '';
                    guideTextBox.style.display = 'none';
                }
            }
        }).open();
    }       
    }
    }

</script>

<style>
.address-layout{
    display:none;
    position:fixed;
    overflow:hidden;
    z-index:1;
    -webkit-overflow-scrolling:touch;
}
</style>

3. component import

본래 사용할 component에 Address.vue 를 import 하도록 합니다.

<template>
  <Address />
</template>

<script>
import Address from './Address'

  export default {
      components: {
          Address,
      },
</script>

■ 결과 확인

이제 우편번호 찾기를 클릭하면 정상적 출력 됨을 확인하실 수 있습니다.

■ 후기

사실 완전히 Vue.js style로 변형한건 아닙니다.

그냥 js 기반의 언어기 때문에 혼용이 될 뿐입니다.

$emit 을 이용한다던가, data () {} 를 작성하여 값을 모니터링 한 것도 아닙니다.

쓰면 좋겠지만, 렌더링 속도나 구현 속도 등을 고려했을 때 굳이 안바꿔도 된다 생각하여 제멋대로 변형해보았습니다.

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

[ Vue.js ] methods , computed 안에서 함수 호출하는 방법 (0)	2021.11.22
CORS 에러 없애기 (0)	2021.11.22
[ Vue.js ] Axios - PHP, 200 response를 Error로 보내는 방법 (0)	2021.11.18
[ Vue.js ] Axios - post - php 데이터 송신방법 \| REST API \| 다른 포트 번호 에서 데이터 송수신 (1)	2021.11.12
[ Axios ] Axios 사용하기 / url에 관한 짧은 정보 / where is root path of Axios(url) ? / 예시 / example (0)	2021.11.11

Vue.js 에서 회원 로그인 정보를 php 로 axios를 통해 보내고 200 success response를 받았다.

하지만 그 내용을 오류로 넘기고 싶을 때 처리하는 방법

.then((response) => {
          if( response.data == false ) {
throw new Error('no data from server');
} else {
console.log('success');
}
        })

        .catch((error) => {
console.log(error);
this.errors.push("회원정보가 존재하지 않습니다.");
        });

then() 내에서 new Error로 넘겨주면,
아래 catch(error) 에서 해당 에러를 출력해준다.
그리고 this.errors.push 를 통해 error라는 id 를 가진 html 태그에 에러 내용을 출력해준다.

■ 신경쓸 점

1. throw new Error( )

throw를 통해 새로운 에러 객체를 생성하는 작업.
이 작업을 통해 catch가 에러를 인식하고 해당 내용을 출력한다.

2. catch(error) => {

Arrow function의 인스턴스 함수의 기능을 이용하여,
에러 함수 내에서 전역변수( this. )를 사용할 수 있게 한다.

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

CORS 에러 없애기 (0)	2021.11.22
[ Vue.js ] daum 주소 api 사용하는 방법 (예제 example) (0)	2021.11.18
[ Vue.js ] Axios - post - php 데이터 송신방법 \| REST API \| 다른 포트 번호 에서 데이터 송수신 (1)	2021.11.12
[ Axios ] Axios 사용하기 / url에 관한 짧은 정보 / where is root path of Axios(url) ? / 예시 / example (0)	2021.11.11
[ Vue.js ] Component 등록의 2가지 방법(전역/지역) 과 번외 (0)	2021.11.10

사용환경 : Linux, Ubuntu, Vue.js 3, vue-cli, axios - post, php

Vue-cli port : 8081
PHP Apache server port : 8080

Vue.js 3 에서 axios를 이용해 php 에 데이터를 송신하는 방법을 포스팅하도록 하겠습니다.

3일째 이거 만지다가 어쩌다 됐습니다. 억울..

[버전은 상관없지만] @vue/cli 4.5.15 에서 적용하였습니다.

■ 1. Vue-cli project 설정 1/2

/src/views/Account/AxiosTest.vue

제가 form을 이용해 post data 를 송신할 Vue 페이지는 위와 같습니다.

AxiosTest.vue
=> input 태그 2개로, id 와 password를 전달하려고 합니다.

1. Template

<template>
  <div>
    <form action="" @submit="checkForm">
      <input type="text" name="id" v-model="idValue" />
      <input type="password" name="password" v-model="passwordValue" />
      <button type="submit">submit</button>
    </form>
  </div>
</template>

2. script

■ 1. Vue-cli project 설정 2/2

vue.config.js

프로젝트의 root 경로에 vue.config.js 파일을 없으신 분들은 생성해주시고 아래의 내용을 복붙해주세요.

vue.config.js

module.exports = {
  devServer: {
    proxy: {
      "/api": {
        target: "http://localhost:8080/",
      },
    },
  },
};

■ 3. php

Apache 서버를 사용하신다면, 8080포트로 구동 중이실겁니다. (본인의 포트에 맞게 설정해주세요)

/var/www/html/ 경로에 /api 폴더를 생성해주세요. 이곳에 axios의 data 를 수신할 php 파일을 생성할겁니다.

이렇게 생성하였습니다. (자유롭게 생성해주세요. 보통 /api 라고 많이 생성합니다.

/api/loginCheck.php

<?php
// header의 요청을 수락하는 php 설정들. 안해주면 데이터를 못받는 경우가 생김
header('Access-Control-Allow-Origin:*');
header("Access-Control-Allow-Credentials", "true");
header('Access-Control-Allow-Headers", "Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers');
header('Access-Control-Allow-Methods:GET,POST,PUT,DELETE,OPTIONS');

$data = json_decode(file_get_contents('php://input'), true);

// 반복문으로 데이터 출력

■ 결과

감격스럽게도 200 통신 성공 결과가 출력되었고,

php에서 $data 는 array 의 타입이기 때문에 출력 결과(response) 가 array 로 출력되었습니다.

■ 1차 수정

- 기존에 params 를 넘겨줘서 자꾸 데이터가 array로 출력이 되었습니다.

- 기존 : data(=params객체) : jsonStyleValues
- 변경 : { jsonStyleValues list}

* POST method에서는 params 를 넘겨주면 안된다.

참고

Sending Axios parameters with a POST request in PHP – ZeroWP

Using a library like Axios to create complex AJAX requests is simple and easy. Of course, we can use `fetch` but still, I prefer Axios because of the many options it has, which is lightweight, well documented, and stable. Recently I tried to use it by crea

zerowp.com

Configuration Reference | Vue CLI

Configuration Reference Global CLI Config Some global configurations for @vue/cli, such as your preferred package manager and your locally saved presets, are stored in a JSON file named .vuerc in your home directory. You can edit this file directly with yo

cli.vuejs.org

https://coderedirect.com/questions/43570/axios-get-from-local-php-just-returns-code-instead-of-executing

Axios GET from local PHP just returns code instead of executing - Code Redirect

The API I am trying to access has disabled CORS so I need to request on the server side. Utilizing React and Axios I am making a get request to the local php file which should execute cURL but am j...

coderedirect.com

덕분에 3일동안 axios와 http, proxy, 등에 대해 많이 공부할 수 있었습니다.

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

[ Vue.js ] daum 주소 api 사용하는 방법 (예제 example) (0)	2021.11.18
[ Vue.js ] Axios - PHP, 200 response를 Error로 보내는 방법 (0)	2021.11.18
[ Axios ] Axios 사용하기 / url에 관한 짧은 정보 / where is root path of Axios(url) ? / 예시 / example (0)	2021.11.11
[ Vue.js ] Component 등록의 2가지 방법(전역/지역) 과 번외 (0)	2021.11.10
[ Vue.js \| Vuex ] Vuex 설치 에러 \| npm ERR! code ERESOLVEnpm ERR! ERESOLVE unable to resolve dependency tree (0)	2021.11.10

REST API를 적용하고,
Vue.js 혹은 React.js에서 Axios를 사용할 때에 초보자는 도대체 backend 를 담당하는 파일을 어디에다가 놓아야할지 모를 경우가 생깁니다.

네 그게 바로 접니다.

환경 및 사용 : Linux (Ubuntu) , Apache , vue - cli project , php , axios

예시)

        axios
          .get('http://urlExample:8080/phpFileName')
          .then(function(response) {
          console.log(response);
          })
          .catch(function(error) {
          console.log(error.response.data);
          })

get 방식으로 axios를 사용해보겠습니다.

apache 서버는 8080포트를 기본으로 사용하고 있습니다. 이를 통해 axios를 port 8080에서 값을 요청하고 받아옵니다.

그럴 때 php 파일의 위치는

/var/www/html/ 에 작성해야합니다.

추가적으로 api 폴더를 생성하여 그곳에 넣는 방법도 있습니다. ㅎㅎ

만약 이렇게 했을 때 아래와 같은 에러가 발생하면 해당 포스트를 확인해주시길 바랍니다.

[ PHP, Vue.js ] 에러 해결 Access to XMLHttpRequest at blocked by CORS policy: No 'Access-Control-Allow-Origin' header is pr

Access to XMLHttpRequest at 'http://url/fileName' from origin 'http://url:port-number' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource...

code-hoon.tistory.com

감사합니다.

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

[ Vue.js ] Axios - PHP, 200 response를 Error로 보내는 방법 (0)	2021.11.18
[ Vue.js ] Axios - post - php 데이터 송신방법 \| REST API \| 다른 포트 번호 에서 데이터 송수신 (1)	2021.11.12
[ Vue.js ] Component 등록의 2가지 방법(전역/지역) 과 번외 (0)	2021.11.10
[ Vue.js \| Vuex ] Vuex 설치 에러 \| npm ERR! code ERESOLVEnpm ERR! ERESOLVE unable to resolve dependency tree (0)	2021.11.10
[ Vue.js ] Vue-cli - proxy error " Proxy error: Could not proxy request " (0)	2021.11.09

Vue.js 에서 Component (컴포넌트)를 3가지 방법으로 선언할 수 있다.

1. Global (전역 선언)
2. Local (지역 선언)
3. 파일 분리

1,2번의 방법은 사실 별로라고 생각한다. 그 이유인즉슨, 특정 컴포넌트 내에 또 다른 컴포넌트를 작성하여 적용시키는 방법이라 생각하면 되는데, 가독성이 좋지 않다.

물론 컴포넌트를 한 개의 파일에서 관리할 수 있다는 매력이 있지만, 애초에 `template` 속성 내에 전부 때려 넣다보니 편리함보다는 오히려 보기가 너무 불편하다.

Syntax Highlight 지원도 받기 어렵다. (혹시 있나?)

■ Global [전역]

예시)

이렇게 ' component 명' 을 먼저 선언하고,
그 뒤에 template 속성을 선언하여 ` ` 속에 html 을 비롯한 모든 태그들을 작성하는 것이다.

■ Local [지역]

지역 선언은 전역과 약.간. 다르다.

예시)

차이점은 변수에 할당한다는 점... ( ES6로 넘어오면서 코드의 엄격성을 생각하여 var 사용은 자제하자.)
나머지는 동일하게 template 내에 작성한다.

■ 파일분리

가장 선호하는 방식이고, 주로 사용되는 방식이다.

[ Header.vue, Content.vue ] 가 있다면, Header.vue 내에 Content.vue를 import하여 사용하는 것이다.

이렇게 넣으면 컴포넌트 간에 따로 파일을 관리하여 유지보수 하기에 용이하다.

데이터 통신을 하기 위해서는 다른 수고를 넣어야하지만, 가독성이 좋아져서 선호한다.

참고

Components | Cracking Vue.js

뷰 컴포넌트 컴포넌트는 화면의 영역을 구분하여 개발할 수 있는 뷰의 기능입니다. 컴포넌트 기반으로 화면을 개발하게 되면 코드의 재사용성이 올라가고 빠르게 화면을 제작할 수 있습니다.

joshua1988.github.io

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

[ Vue.js ] Axios - post - php 데이터 송신방법 \| REST API \| 다른 포트 번호 에서 데이터 송수신 (1)	2021.11.12
[ Axios ] Axios 사용하기 / url에 관한 짧은 정보 / where is root path of Axios(url) ? / 예시 / example (0)	2021.11.11
[ Vue.js \| Vuex ] Vuex 설치 에러 \| npm ERR! code ERESOLVEnpm ERR! ERESOLVE unable to resolve dependency tree (0)	2021.11.10
[ Vue.js ] Vue-cli - proxy error " Proxy error: Could not proxy request " (0)	2021.11.09
[ Vue.js ] 'Axios' is not defined no-undef (0)	2021.11.09

Vue.js 3 프로젝트에서 Vuex를 설치하려고 했는데 해당 에러가 발생하였다.

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: kiosk@0.1.0
npm ERR! Found: vue@3.2.21
npm ERR! node_modules/vue
npm ERR!   vue@"^3.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"^2.0.0" from vuex@3.6.2
npm ERR! node_modules/vuex
npm ERR!   vuex@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2021-11-10T02_31_20_661Z-debug.log

이 에러는 Vue.js 3 버전에서 Vuex를 설치하였기 때문에 발생하는 에러이다.

그렇기 때문에 처음에 vue.js 3를 설치하는 방법대로 해야만 한다.

■ 해결 방법

npm install vuex@next --save

를 명령해준다.

Failed to install Vuex in Vue3

I want to install Vuex but I get an error. // error npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: vuejs-v-3@0.1.0 npm ERR! Found: vu...

stackoverflow.com

아, 그리고 이제 본문에 광고를 넣지 않기로 마음먹었다.
종종 내 포스트들을 보면 너무 난잡해보이는 경향이 있다.
중간 ads를 아예 안넣었는데도 난잡해보이면, 음... 게시글 상단의 광고도 지울 생각이다.

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

[ Axios ] Axios 사용하기 / url에 관한 짧은 정보 / where is root path of Axios(url) ? / 예시 / example (0)	2021.11.11
[ Vue.js ] Component 등록의 2가지 방법(전역/지역) 과 번외 (0)	2021.11.10
[ Vue.js ] Vue-cli - proxy error " Proxy error: Could not proxy request " (0)	2021.11.09
[ Vue.js ] 'Axios' is not defined no-undef (0)	2021.11.09
[ Vue.js ] Error - [WDS] Disconnected! 에러 (0)	2021.11.09

Linux, Ubuntu, Vue-cli, axios를 사용하는데, proxy 에러가 출력되었다.

Proxy error: Could not proxy request

■ 해결 방법

해당 에러는 root 경로의 vue.config.js 에서 proxy 관련 정보를 수정하면 된다.

/vue.config.js

module.exports = {
devServer: {
proxy: {
"/api": {
target: "https://localhost:8081/",
},
},
}

기본 경로(/root)가 될 port 번호와 정보를 작성하면 된다.

proxy 문제가 해결된것을 확인하실 수 있습니다.

이렇게 axios를 이용해서 데이터를 올바른 경로에서 뽑아오면 되겠습니다.

Form Handling | Cracking Vue.js

Form 다루기 폼(Form)은 웹 애플리케이션에서 가장 많이 사용되는 코드 형식입니다. 로그인이나 상품 결제 등 모든 곳에 사용자의 입력을 처리하는 폼이 필요합니다. Form 제작하기 그럼 뷰로 간단

joshua1988.github.io

vue proxy 사용하기

vue cli 3.x 버전 이상에서 웹팩 개발서버를 이용해서 프록시 요청을 보내봅시다.

velog.io

저작자표시 (새창열림)

'FrontEnd > Vue.js' 카테고리의 다른 글

[ Vue.js ] Component 등록의 2가지 방법(전역/지역) 과 번외 (0)	2021.11.10
[ Vue.js \| Vuex ] Vuex 설치 에러 \| npm ERR! code ERESOLVEnpm ERR! ERESOLVE unable to resolve dependency tree (0)	2021.11.10
[ Vue.js ] 'Axios' is not defined no-undef (0)	2021.11.09
[ Vue.js ] Error - [WDS] Disconnected! 에러 (0)	2021.11.09
[ Vue.js ] 에러 - Error: You cannot call "get" on a collection with no paths. Instead, check the "length" property first to verify at least 1 path exists. (0)	2021.11.09

FrontEnd

■ 에러내용

'FrontEnd > Vue.js' 카테고리의 다른 글

■ 작업 순서

1. index.html 파일에서 cdn 연결해주기

2. component 생성

3. component import

■ 결과 확인

'FrontEnd > Vue.js' 카테고리의 다른 글

■ 신경쓸 점

1. throw new Error( )

2. catch(error) => {

'FrontEnd > Vue.js' 카테고리의 다른 글

■ 1. Vue-cli project 설정 1/2

1. Template

2. script

■ 1. Vue-cli project 설정 2/2

■ 3. php

■ 결과

■ 1차 수정

'FrontEnd > Vue.js' 카테고리의 다른 글

'FrontEnd > Vue.js' 카테고리의 다른 글

■ Global [전역]

■ Local [지역]

■ 파일분리

'FrontEnd > Vue.js' 카테고리의 다른 글

■ 해결 방법

'FrontEnd > Vue.js' 카테고리의 다른 글

■ 해결 방법

/vue.config.js

'FrontEnd > Vue.js' 카테고리의 다른 글

티스토리툴바