[CesiumJS] 2. CesiumJS Quickstart 따라하기(2)

https://insuisinsu.tistory.com/20

[CesiumJS] 2. CesiumJS Quickstart 따라하기

에러가 나면서 끝났다.

 

01. [webpack-cli] Error: Cannot find module 'mini-css-extract-plugin'

 

mini-css-extract-plugin 이게 잘 안 깔린 것 같다.

 > npm install mini-css-extract-plugin

다시 설치해주면 해결된다.

 

하지만 여전히 지도가 나오지 않는다

 

 

02. 지도 나오게 하기

 

아래 링크의 webpack.config.js 파일을 보면 그 해답을 찾을 수 있다.

 

https://github.com/CesiumGS/cesium-webpack-example/blob/d5a29d99cb44c0026cfe4abf580437174275f546/webpack.config.js

GitHub - CesiumGS/cesium-webpack-example: The minimal recommended setup for an application using Cesium with Webpack.

 

// 다른 변수들처럼 최상단에 선언해준다.

const cesiumSource = 'node_modules/cesium/Source';
const cesiumWorkers = '../Build/Cesium/Workers';
const CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack');



// plugins 에 아래 내용을 추가한다.

// Copy Cesium Assets, Widgets, and Workers to a static directory
    new CopyWebpackPlugin({
      patterns: [
          { from: path.join(cesiumSource, cesiumWorkers), to: 'Workers' },
          { from: path.join(cesiumSource, 'Assets'), to: 'Assets' },
          { from: path.join(cesiumSource, 'Widgets'), to: 'Widgets' },
          { from: path.join(cesiumSource, 'ThirdParty'), to: 'ThirdParty' }
      ]
    }),
    new webpack.DefinePlugin({
      // Define relative base path in cesium for loading assets
      CESIUM_BASE_URL: JSON.stringify('')
    })

 >  npm run dev  

성공!

+ viewer 를 없애는 옵션도 있지만 그건 다음 시간에.

+ 찾아보니 geoserver 등에서 지도를 받아 올 수도 있다.

 

 

아래 내용 버림 ========================

02.

oneTimeWarning.js:44 createWorldTerrain was deprecated in CesiumJS 1.104.
It will be in CesiumJS 1.107. Use createWorldTerrainAsync instead

와

createOsmBuildings 대신 createOsmBuildingsAsync 

을 사용하라는 내용이 나온다.

 

index.js 에서 찾아서 바꾸어준다.

 

03. 이건 어떻게 해야할지 모르겠다.

An error occurred while rendering. Rendering has stopped.

TypeError: primitives[i].update is not a function

TypeError: primitives[i].update is not a function at PrimitiveCollection.update (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Scene/PrimitiveCollection.js?:366:19) at updateAndRenderPrimitives (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Scene/Scene.js?:2663:21) at executeCommandsInViewport (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Scene/Scene.js?:2512:3) at Scene.updateAndExecuteCommands (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Scene/Scene.js?:2379:5) at render (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Scene/Scene.js?:2958:9) at tryAndCatchError (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Scene/Scene.js?:2972:5) at Scene.render (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Scene/Scene.js?:3037:5) at CesiumWidget.render (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Widget/CesiumWidget.js?:738:17) at render (webpack://my-webpack-project/./node_modules/@cesium/engine/Source/Widget/CesiumWidget.js?:64:18)

OK