Vuejs - 수집되지 않은 유형 오류: 속성을 재정의할 수 없습니다: $router
저는 Vuejs에 비교적 익숙하지 않습니다.지금부터 다음 오류가 발생하고 있습니다.(페이지가 로드될 때 표시됨)
수집되지 않은 유형 오류: 속성을 재정의할 수 없습니다: $router
Function.defineProperty()로 지정합니다.
Function.install(VM2179 vue-router.esm.js:526)로 설정
기능하고 있습니다.Vue.use (vue.js:4738)
at eval (VM2179 vue-router.esm.js:2447)
오브젝트../node_modules/vue-router/dist/vue-router.esm.js(VM2105 app.js:1615)
__webpack_require__(VM2105 app.js:712)로
fn (VM2105 app.js:95)
at eval (VM2178 index.js:3)
at 객체../src/router/index.js(VM2105 app.js:2415)
__webpack_require__(VM2105 app.js:712)로
이 문제는 웹 앱의 유용성에 영향을 주지 않는 것 같습니다.Vue.use(Router)를 여러 번 선언하는 것은 아닙니다.
다음은 index.js 파일입니다(src/router 단위).
import Vue from 'vue'
import Router from 'vue-router'
import Blog from '../components/Blog.vue'
import BlogPost from '../components/BlogPost.vue'
Vue.use(Router)
Vue.config.silent = true
export default new Router({
routes: [
{
path: '/blog',
name: 'Blog',
component: Blog
},
{
path: '/blog/:slug',
name: 'Blog-post',
component: BlogPost
}
]
})
app.ts: (src, 메인 진입점)
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store/simple_store'
import '../assets/app.css'
import './assets/main_logo.css'
import './assets/pages/page_header_animation.css'
new Vue({
el: '#app',
router,
store,
render: h => h(App)
})
도와주세요!고마워!!
해결했습니다!
index.html 파일에서 vue를 다시 Import했습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Meko Deng</title>
</head>
<body>
<div id="app"></div>
<!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> -->
</body>
</html>
코멘트가 제대로 된 것 같아요!
이는 의 다음 코드에 기인합니다.vue-router
if (inBrowser && window.Vue) {
window.Vue.use(VueRouter);
}
파일을 포함할 때만 존재합니다.<script>블록(빌드 시스템 없음)
모두 제거<script>Vue 또는 관련 컴포넌트와 관련된 요소. 웹 팩을 사용할 때는 필요하지 않습니다.
웹 팩을 사용하다가 세트를 잊어버린 것 같습니다.
externals: {
Vue: 'vue'
}
이 경우 외부 CND와 웹 팩의 lib에서 vue와 vue-router를 2회 초기화했습니다.
만약 당신이 아래 줄을 두 번 사용하지 않는다고 확신한다면.
Vue.use(VueRouter);
그러면 스크립트를 두 번 추가했기 때문에 이렇게 됩니다.
<script src="{{ asset('js/app.js') }}" defer></script>
중복된 스크립트를 삭제합니다.기본적으로 Larabel은 app.blade의 머리 부분에 이 스크립트 태그를 추가합니다.php 파일
언급URL : https://stackoverflow.com/questions/52209717/vuejs-uncaught-typeerror-cannot-redefine-property-router
'programing' 카테고리의 다른 글
| Windows 7에 pywin32 모듈을 설치하는 방법 (0) | 2022.09.03 |
|---|---|
| Vue.js: 리플릿 마커가 표시되지 않음 (0) | 2022.09.03 |
| Vuex 스토어 변경으로 렌더 새로 고침을 트리거하는 방법 (0) | 2022.09.03 |
| Vuex: 정의되지 않은 속성 '$store'를 읽을 수 없습니다. (0) | 2022.09.03 |
| 잭슨 VS지손 (0) | 2022.09.03 |