google map에서 사용 가능한, 플러그인 처럼 사용하는 markerclusterer라는 라이브러리를 사용했었다.
하지만 이를 의존등록한 이후 앱을 실행시켰을 경우 어떤 오류가 보였다.
소스맵 파일을 찾을 수 없다는 오류였는데, 아래와 같았다.
Compiled with warnings.
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/core.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/core.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/grid.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/grid.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/noop.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/noop.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/supercluster.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/supercluster.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/utils.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/utils.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/cluster.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/cluster.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/markerclusterer.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/markerclusterer.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/overlay-view-safe.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/overlay-view-safe.ts'
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/renderer.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/renderer.ts'
Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/core.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/core.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/grid.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/grid.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/noop.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/noop.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/supercluster.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/supercluster.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/utils.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/algorithms/utils.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/cluster.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/cluster.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/markerclusterer.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/markerclusterer.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/overlay-view-safe.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/overlay-view-safe.ts'
WARNING in ./node_modules/@googlemaps/markerclusterer/dist/index.esm.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/renderer.ts' file: Error: ENOENT: no such file or directory, open '/Users/내 파일 경로/node_modules/@googlemaps/markerclusterer/src/renderer.ts'이런 오류 메세지가 나오긴 했으나, 기능은 정상적으로 작동했다. 전체적인 앱 동작에도 아무런 문제는 없었다. 그래도 저런 메세지가 보인다는 것이 껄끄러워서 검색을 했다.
구글 검색을 통해 나와 같은 오류를 만난 사람들이 작성한 글들을 읽었다.
해당 저장소의 이슈에 이미 등록이 되어있었는데, 이슈를 작성한 사람만의 특수한 문제라고 판단했는지, 더 자세한 내용 공유를 부탁하며 이슈를 닫아버렸다.
https://github.com/googlemaps/js-markerclusterer/issues/232
이슈가 닫혔으나, 몇 사람들은 자신도 오류가 나온다고 작성을 했었는데, 나도 경고만이라도 안나오게 만들고 싶은 마음에 징징거렸었다.
그리고 어느날 우연한 계기로 해당 오류를 다시 찾아보게 되었는데 관련 이슈가 태그되어 어떤 풀리퀘스트가 머지되었다.
징징거린 바로 그날 머지가 되었다.
커밋 내용 열어보니 tsconfig에 sourceMap이라는 것을 삭제했는데, 검색을 해보니 이런 설정이 있으면 빌드를 하면서 소스맵 파일을 같이 생성하는 것 같다. 결국 생성되는 소스맵 내부에 존재하는 오류를 해결하여 근본적인 문제를 해결했다기보다는 그냥 생성 자체를 하지 않도록 하여, 오류를 해결했다고 봐야 하는 것일까? 잘은 모르겠다.
오류 수정이 이루어진 날 저장소 releases에 2.0.8에서 2.0.9로 patch 버전이 변경이 되었다.
내 package.json에는 ^2.0.8 라고 적혀있어 패키지 install을 하면 자동으로 minor 버전까지 업데이트가 되는 것 같아 node_modules 폴더를 지우고 다시 재설치를 진행했다.
그런데 package.json에서도 버전이 변경되지 않았고, 오류도 계속해서 나왔다. 저런 tilde나 caret의 기호가 존재하는 상태로 npm install을 진행하면, 알아서 자신의 기호가 의미하는 범위 내에서 등록된 최근의 버전으로 업데이트된 내역이 있다면 업데이트 해주는줄 알았으나, 그렇게 진행되지 않았었다.
이런 module 버전 업데이트를 해본 적이 없으니까 잘 몰라서 검색을 했다. 그래서 찾아보다가 npm update라는 키워드를 확인했다. npm update 뒤에 특정 패키지명을 적어주면 그것을 업데이트를 진행하는 것이었다. 그리고 이를 진행하려 했는데, 이것을 해보기 전에 일단 package.json에 caret을 지우고 이미 존재했던 버전으로 업데이트를 진행을 해보고, 이후에 caret을 추가하고 업데이트를 했었다. (당시 npm update를 하면 package.json에 작성한 것과 상관 없이 그냥 무조건 최근 버전의 패키지를 가져올 수도 있다고 생각했었다.)
caret을 빼고 npm update를 하니 변화가 없다. 그래서 caret을 넣고 했는데 그래도 변화가 없다. 오류도 그대로 나온다.
새폴더에 npm init을 통해 프로젝트를 새로만들고 npm install로 해당 라이브러리를 다운 받고 package.json 파일에서 버전을 확인하니 2.0.8그대로다. 확인해보니, 해당 프로젝트 github repository의 release에는 버전 업데이트가 되었으나, npm에 아직 반영하지 않았었다.
나중에 업데이트된 버전이 npm에 올라가게 된다면 다음에 시도를 해보도록 마음먹고 넘기려다가 이슈로 등록했다.
2주가 넘게 지나서야 2.0.10으로 업데이트가 되며 이슈가 닫혔다.
드디어 테스트 해보는구나 하고 이것저것 했는데도 또 안되어서 보니까 아직도 npm에서는 2.0.8로 멈춰있다.
나의 뜻이 전해지지 않은 것일까 마음이 아팠다. 여전히 해당 패키지를 사용하는 프로젝트는 앱을 실행시켰을 때 긴 오류메세지를 봐야했다.
마음이 아파 이슈를 등록하니, 다음날 완료가 되었다는 답을 받았다. 답변을 보니 원래 자동으로 npm에 등록해주는 CI가 있는데, 이것에 문제가 있는 것 같았고, 그래서 직접 등록한 것 같다. npm에도 정상적으로 버전이 업데이트 되었다.
이제야 의존 패키지가 새로운 버전으로 업데이트 되었을 내가 어떻게 하면 이것을 업데이트할 수 있는 것인지 테스트를 진행할 수 있다.
npm install로는 안되었다. npm update를 할 경우에, package.json에 작성된 버전은 그대로며, 대신 package-lock.json 에서 실제로 사용하고있는 @googlemaps/markerclusterer 버전이 2.0.10으로 업데이트가 된 것을 볼 수 있었다. 앱을 실행해보니, 오류 메세지는 사라졌다.
근데 이렇게 되면, npm ci를 통해 패키지를 설치하지 않고 npm install로 설치할 경우 새롭게 클론받은 프로젝트는 여전해 오류가 나올 것이다. 그러면, package.json에도 이런 버전 업데이트를 할 수 있는 방법이 있지 않을까 찾아봤다.
npm i -g npm-check-updates
ncu -u
npm install위와 같은 결과를 확인했고, ncu라는 것은 처음보지만, 저것 까지 진행하니 package.json에 명시해주는 내부 의존 패키지들까지 최신 버전으로 변경되었으며, 터미널에는 기존에 설치된 다른 패키지들의 최신 버전들도 어떤식으로 변경이 있었는지 보여준다.
