[컴][nodejs] import 가 안되는 npm package 의 경우

how to use owl-carousel 1.3.3. on webpack  / why the owlcarousel module is not imported on webpack


webpack 에서 owl-carousel 1.3.3 사용

owl-carousel 을 사용하려는데, 이녀석들은 npm package 도 여러개가 있어서 어느것을 사용할 지 몰랐다. 그래서 이것저것 사용을 해 보려고 일단 설치를 했다.

그런데 import 가 안된다.
정확히는 아래처럼 error message 가 보인다.
Module not found: Error: Can't resolve 'owlcarousel-umd' in '<project_root>\src\js'


그런데 잘 보면 node_modules 에서 찾지 않고, js 에서 찾고 있었다.
이런 경우에 module 의 package.json 이 제대로 설정되어 있지 않은 경우일 수 있다. 적어도 owl-carousel 의 경우는 그러했다.

owlcarousel-umd 의 예를 들면, package.json 이 아래처럼 되어 있다.
<project_root>\node_modules\owlcarousel-umd\package.json
{
  "name": "owlcarousel-umd",
  "version": "1.3.3",
  "description": "Owl Carousel. Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider.",
 
  "files": [
    "owl-carousel/owl.carousel.js"
  ],
...

main | package.json

여기에 빠져있는 부분이 "main" 인데, 이녀석이 없어서 webpack 에서 인식을 못한다. 그래서 아래 부분을 추가해줬다.
"main" : "owl-carousel/owl.carousel.js",

그러니 webpack 에서 import 가 잘 동작한다.







댓글 없음:

댓글 쓰기