반응형
반응형

[javascript] Vue.js - 전환효과


https://kr.vuejs.org/v2/guide/transitions.html


패키지 :  https://unpkg.com/vue


전환 효과

개요

Vue는 항목이 DOM에 삽입, 갱신 또는 제거 될 때 전환 효과를 적용하는 다양한 방법을 제공합니다. 여기에는 다음과 같은 도구가 포함됩니다.

  • CSS 전환 및 애니메이션을 위한 클래스를 자동으로 적용합니다.
  • Animate.css와 같은 타사 CSS 애니메이션 라이브러리 통합
  • 전환 훅 중에 JavaScript를 사용하여 DOM을 직접 조작
  • Velocity.js와 같은 써드파티 JavaScript 애니메이션 라이브러리 통합

이 페이지에서는 진입, 진출 및 목록 전환만 다루지만 다음 섹션에서는 전환 상태 관리를 볼 수 있습니다.




Vue.js 컴포넌트간-전환


Vue.js 리스트 전환


Vue.js 리스트-이동-전환


Vue.js - 리스트 진입/진출/이동 전환



Vue.js - Lazy Sudoku https://jsfiddle.net/chrisvfritz/sLrhk1bc/



Vue.js - 비틀거리는목록/동적전환



...

반응형
반응형

[OpenSource] UNPKG


unpkg는 Michael Jackson이 만들고 유지 관리 하는 open source project  입니다.



Vue.js 는 "https://unpkg.com/vue" 로 연결해서 사용하고 있다. 



unpkg is a fast, global content delivery network for everything on npm. Use it to quickly and easily load any file from any package using a URL like:

unpkg.com/:package@:version/:file

Examples

Using a fixed version:

You may also use a semver range or a tag instead of a fixed version number, or omit the version/tag entirely to use the latest tag.

If you omit the file path, unpkg will serve the package's "main" file.

Append a / at the end of a URL to view a listing of all the files in a package.

Query Parameters

?main=:mainField
The name of the field in package.json to use as the main entry point when there is no file path in the URL. Defaults to using unpkgbrowser, and then main.
?meta
Return metadata about any file in a package as JSON (e.g. /any/file?meta)
?module
Expands all "bare" import specifiers in JavaScript modules to unpkg URLs. This feature is very experimental



Sponsors - 무보수의 강력한 글로벌 인프라는 Cloudflare 와 Heroku가 기부합니다 .



Cache Behavior


CDN은 npm 패키지 버전을 포함하여 영구 URL을 기반으로 모든 파일을 캐시합니다. 이는 npm이 패키지 작성자가 이미 동일한 버전 번호로 다른 패키지로 게시 된 패키지를 덮어 쓸 수 없기 때문에 가능합니다.


패키지 버전 번호를 지정하지 않은 URL은 패키지 버전 번호로 리디렉션됩니다. 이것은이다 latest어떤 버전이 지정되지 않은 버전, 또는 maxSatisfying때 버전 semver 버전이 제공됩니다. 리디렉션은 5 분 동안 캐시됩니다.


브라우저는 Cache-Control헤더 를 통해 자산을 4 시간 동안 캐시 하도록 지시 받습니다.



Support


unpkg는 무료이며 최선의 노력을 기울이는 서비스이며 가동 시간 또는 지원 보장을 제공 할 수 없습니다.


나는 그것을 계속 실행하기 위해 최선을 다하지만 때로는 일이 잘못 될 수 있습니다. 내 통제 범위 밖에서 네트워크 또는 공급 업체 문제가있는 경우가 있습니다. 때로는 까다로운 트래픽이 일시적으로 응답 시간에 영향을 미칩니다. 때로는 뭔가 바보 같은 짓을해서 일을 망쳐 놓지 만, 나는하지 않으려 고 노력합니다.


unpkg의 목표는 npm 패키지 작성자에게 번거롭지 않은 CDN을 제공하는 것입니다. 데모 및 교육 자료를 만드는 사람들에게 유용한 자료이기도합니다. 그러나 비즈니스에 중요한 파일을 제공하는 데 의존하는 경우 잘 지원되는 인프라와 가동 시간 보장을 갖춘 호스트에 비용을 지불해야합니다.


unpkg는 npm, Inc.와 어떤 식 으로든 제휴 또는 지원되지 않습니다. unpkg에 도움이 필요하면 npm에게 연락하지 마십시오.




...

반응형

+ Recent posts