[javascript] Vue.js 응용 프로그램 디버깅을위한 Chrome devtools 확장 프로그램.

GitHub :  https://github.com/vuejs/vue-devtools

크롬브라우저에서 확장프로그램 들어간 다음 "vue.js" 로 검색하면 나옴. 설치!

vue-devtools

Important Usage Notes

1. If the page uses a production/minified build of Vue.js, devtools inspection is disabled by default so the Vue pane won't show up.

2. To make it work for pages opened via file:// protocol, you need to check "Allow access to file URLs" for this extension in Chrome's extension management panel.

Works with vuex for time-travel debugging:

Installation

• Get the Chrome Extension

• Get the Firefox Addon

• Workaround for Safari

Manual Installation

Make sure you are using Node 6+ and NPM 3+

1. Clone this repo
2. npm install (Or yarn install if you are using yarn as the package manager)
3. npm run build
4. Open Chrome extension page
5. Check "developer mode"
6. Click "load unpacked extension", and choose shells/chrome.

Hacking

1. Clone this repo
2. npm install
3. npm run dev
4. A plain shell with a test app will be available at localhost:8080.

Testing as Firefox addon

1. Install web-ext

   $ npm install --global web-ext
   

   Or, for Yarn:

   $ yarn global add web-ext
   

   Also, make sure PATH is set up. Something like this in ~/.bash_profile:

   $ PATH=$PATH:$(yarn global bin)
   

2. Build and run in Firefox

   $ npm run build
   $ npm run run:firefox
   

   When using Yarn, just replace npm with yarn.

...

부가서비스, 확장프로그램

Chrome to Phone  : https://chrome.google.com/webstore/detail/google-chrome-to-phone-ex/oadboiipflhobonjjffjbfekfjcgkhco?hl=ko

설명

Google Chrome to Phone 확장 프로그램을 사용하면 링크 및 기타 정보를 크롬에서 개인 Android 기기로 전송할 수 있습니다.

이 확장 프로그램을 설치하면 링크, 지도, 현재 선택한 텍스트와 전화번호를 내 Android 기기로 손쉽게 전송할 수 있는 버튼이 Google 크롬에 추가됩니다. 링크나 웹페이지
의 선택 영역을 마우스 오른쪽 버튼으로 클릭하여 내 Android 기기로 보낼 수도 있습>니다.

이 기능을 사용하려면 휴대전화에도 'Chrome to Phone' Android 애플리케이션을 설치>해야 합니다. 애플리케이션은 마켓에서 다운로드할 수 있으며('Chrome to Phone' 검색
), Android 2.2('Froyo') 이상이 탑재된 휴대전화에서 사용하실 수 있습니다.

참고: 이 확장 프로그램을 설치하면 다음 약관에 동의하는 것으로 간주됩니다. - http://chrome.google.com/extensions/intl/en/gallery_tos.html 해당 제품의 소스 코드는
 개발자 웹사이트에서 Apache 2.0 라이센스를 부여받아 사용하실 수 있습니다.

Chrome 웹 스토어 : https://chrome.google.com/webstore/category/apps?hl=ko

responsive 도구 :  Dimensions

Json 데이터 검증 : JSON Formatter

                     Javascript Tools

소스 공유 :           GitHub

Dimensions

설명

Easily test responsive websites, even offline.

Dimensions is a responsive web design testing tool. It is the easiest way to test responsive websites at different viewports. It works offline & is compatible with LiveReload.

Features:

* Draggable handle to find breakpoints
* Works with local or remote servers
* Preview Mode shows your site in various types of devices
* Works with JS auto-refreshers including LiveReload

More devices will be coming soon! Head over to http://dimensionsapp.com and add feedback on which devices you would like to see.

Responsive web design testing tool

이전다음

012