# 2. 라우터 기본

###### tags: `지호`, `Vue.js 완벽 가이드`

---

## 1. 라우터 설치 및 라우터 구현

### 라우터 설치

    npm i vue-router@3.5.3 --save

<br/>

### router-view

라우팅 컴포넌트 표시

src/routes/index.js


<br/>

src/App.vue


<br/>

src/main.js


<br/>

## 2. redirect 속성과 router-link

### redirect

src/routes/index.js

<br/>

### router-link

클릭 시 라우터를 통해 이동 가능하게 함

src/components/ToolBar.vue


src/App.vue


<br/>

### scoped
해당 태그에서만 스타일 적용. 하위 스타일에 영향을 주지 않음.

<style scoped>
    
</style>

<br/>

### history

url에서 # 없이 라우팅이 가능