PureJS 레퍼런싱 확인 방법 > FAQ

본문 바로가기

Wijmo

FAQ

배포 및 라이선싱 PureJS 레퍼런싱 확인 방법

페이지 정보

작성자 GrapeCity 작성일 20-09-11 16:43 조회 428회 댓글 0건

본문

안녕하세요. 이번 포스팅에서는 구현에 있어 추가적으로 필요한 레퍼런싱을 참고하는 방법에 대해서 설명드리도록 하겠습니다. npm으로 레퍼런싱을 하지 않고 로컬 파일 또는 CDN으로 참조를 하면 종종 데모에서 언급되는 참조 이외에 추가적으로 레퍼런싱을 가져와야 구현이 가능한 기능들이 있습니다. 응용 프로그램을 구현하는데 이와 같은 에러를 해결하는 방법을 FlexGridFilter 예제를 통해 알려 드리도록 하겠습니다.



FlexGridFilter를 통한 예시


FlexGridFilter는 엑셀과 유사한 필터이며 더 많은 정보가 필요하신 분들은 여기를 클릭하여 방문해주시기 바랍니다.


해당 데모 페이지를 방문하셔서 아래와 같이 CDN을 참고 하기 위해서 app.js에서 import된 컨트롤들을 확인합니다. 그리드 컨트롤과 관련된 참조는 "wijmo.grid" "wijmo.grid.filter" 입니다.


66ede205ef151a2a9a8a98416b9b3b7c_1599808921_2211.png
 

해당 모듈과 관련된 레퍼런스를 아래와 같이 HTML <head> 태그에 참조를 추가해주시고 나머지 코드도 입력한 뒤, 실행시켜봅니다.


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="shortcut icon" href="">
    <link href="https://cdn.grapecity.com/wijmo/5.20202.699/styles/wijmo.min.css" rel="stylesheet"/>
      <script src="https://cdn.grapecity.com/wijmo/5.20202.699/controls/wijmo.min.js"></script>
 
    <script src="https://cdn.grapecity.com/wijmo/5.20202.699/controls/wijmo.grid.min.js"></script>
    <script src="https://cdn.grapecity.com/wijmo/5.20202.699/controls/wijmo.grid.filter.min.js"></script>

    

(...)
</head>
<body>
  (...)
</body>
</html>


정상적으로 작동하는 것 같은 그리드가 필터 기능을 실행하기 위해 필터 아이콘을 클릭한 순간 다음과 같은 에러가 등장합니다. 이는 Grid 컨트롤 안에는 ComboBox가 없기 때문에 나오는 에러입니다.


66ede205ef151a2a9a8a98416b9b3b7c_1599808989_7613.PNG
 

66ede205ef151a2a9a8a98416b9b3b7c_1599810411_3023.png
 


레퍼런싱 문서에서도 wijmo.input.min.js에 ComboBox 컨트롤이 있다는 것을 확인할 수 있습니다. 그렇다면 wijmo.input.min.js 레퍼런싱 한 뒤, 실행시켜봅시다.


66ede205ef151a2a9a8a98416b9b3b7c_1599810595_6091.PNG
 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
(...)
    <script src="https://cdn.grapecity.com/wijmo/5.20202.699/controls/wijmo.input.min.js"></script>

(...)
</head>
<body>
(...)
</body>
</html>



다음과 같이 정상적으로 실행된 것을 확인할 수 있습니다.




66ede205ef151a2a9a8a98416b9b3b7c_1599809024_8627.PNG
 


하지만 이렇게 일일히 찾아서 하는 것보다 더 정확한 방도가 있습니다. 먼저 PureJS(SystemJS X) 데모 사이트에 방문해 주시기 바랍니다.


 66ede205ef151a2a9a8a98416b9b3b7c_1599809055_3695.PNG



튜토리얼 페이지에 방문하여 원하는 컨트롤에 맞는 데모를 찾아 Edit in JSFiddle를 클릭합니다. JSFiddle은 HTML, CSS, JavaScript를 웹에서 작성해 바로 테스트할 수 있는 서비스를 제공하는 사이트입니다.



66ede205ef151a2a9a8a98416b9b3b7c_1599809117_413.PNG


방문하셔서 왼쪽 중간에 Resources를 클릭하면 해당 데모에 사용했던 참조 리스트가 나옵니다. 이를 참고로 필요한 레퍼런싱를 확인하신다면 위와 같은 에러를 방지하실 수 있습니다.


 

66ede205ef151a2a9a8a98416b9b3b7c_1599809208_5109.PNG
 

 




이번 포스팅 어떠셨나요? Wijmo 평가판을 체험하고 싶으신 분들은 지금 평가판 다운로드 페이지를 방문해주시기 바랍니다!




 
레퍼런싱과 관련하여 문의 사항이 있는 경우, 편하신 방법으로 문의 바랍니다.

* 오류가 발생하는 경우, 화면 스크린샷을 찍어주시거나, 해당 상황에 대해 명확히 설명해주시면 빠른 문제 해결에 도움이 됩니다.

  • 페이스북으로 공유
  • 트위터로  공유
  • 구글플러스로 공유
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

그레이프시티 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기

인기글

더보기
  • 인기 게시물이 없습니다.
그레이프시티 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@grapecity.com | 전화 : 1670-0583 | 경기도 안양시 동안구 시민대로 230, B-703(관양동, 아크로타워) 그레이프시티(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 Copyright ⓒ 2021 GrapeCity inc.