Vue-cli3를 글로벌 설치하고 Vue-cli2를 계속 사용하십시오.x 작업

공식 링크:https://cli.vuejs.org/zh/guide/installation.html
1. Vue cli3 설치
이전 버전 정보
Vue CLI의 패키지 이름은 vue-cli에서 @vue/cli로 변경되었습니다.만약 전역적으로 이전 버전의 vue-cli(1.x 또는 2.x)를 설치했다면, npm uninstall vue-cli-g 또는 yarn 글로벌remove vue-cli를 통해 제거해야 합니다.
Node 버전 요구 사항
Vue CLI가 필요합니다Node.js8.9 이상 버전(8.11.0+ 권장).너는 사용할 수 있다nvm 또는nvm-windows 동일한 컴퓨터에서 여러 Node 버전을 관리합니다.
다음 명령 중 하나를 사용하여 새 패키지를 설치할 수 있습니다.
npm install -g @vue/cli
# OR
yarn global add @vue/cli
설치하면 명령줄에서 vue 명령에 접근할 수 있습니다.vue를 간단하게 실행해서 사용할 수 있는 명령에 대한 도움말을 보여 주었는지 확인하여 설치가 성공했는지 확인할 수 있습니다.
이 명령으로 버전이 정확한지 확인할 수 있습니다 (3.x):
vue --version
2. Vue cli3를 설치한 후 vue-cli2를 사용하고 싶습니다.x 버전
Vue CLI 3은 이전 버전과 동일한 vue 명령을 사용하기 때문에 Vue CLI 2(vue-cli)가 덮어씁니다.만약 이전 버전의 vue init 기능을 사용해야 한다면, 전역적으로 브리지 도구를 설치할 수 있습니다.
npm install -g @vue/cli-init
//설치 후 vue init 명령 사용 가능
vue init webpack my_project
보충 지식: Vue의 vue-router 라우터.beforeEach 내비게이션 수위, 사순환에 빠지다
공식 문서:https://router.vuejs.org/zh/guide/advanced/navigation-guards.html
브라우저 캐시에 사용자의 정보가 있는지 판단하고 없으면 로그인 페이지로 이동합니다.
공식 문서를 보고 바로 이렇게 썼다.(수동으로 캐시를 지우고 URL에서 로그인 페이지를 뛰면 바로 사순환에 빠진다)

router.beforeEach((to,from,next)=>{
 if(sessionStorage.getItem('loginData')){
  Toast(' ');
  next();
 }else {
  // , 
  next({
   path:'/login'
  });
 }
});
왜냐하면next('/login')는 자신이 지정한 경로이기 때문에 루트가 점프할 때beforeEach 네비게이션 갈고리를 한 번 실행하기 때문에 위에 사순환이 발생한다.
판단을 더 하시면 됩니다.

router.beforeEach((to,from,next)=>{
 // console.log(to);
 // console.log(from);
 if(sessionStorage.getItem('loginData')){
  Toast(' ');
  next();
 }else {
  // , 
  if(to.path === '/login'){
   next();
  }else {
   next({
    path:'/login'
   });
  }
 }
});
위의 이 전역 설치 Vue-cli3 및 계속 사용 Vue-cli2.x조작은 바로 편집자가 여러분에게 공유한 모든 내용입니다. 여러분께 참고가 되고 저희를 많이 사랑해 주시기 바랍니다.

좋은 웹페이지 즐겨찾기