# Using Cesium npm package with Nuxt 3

**URL:** <https://community.cesium.com/t/using-cesium-npm-package-with-nuxt-3/29593>\
**Category:** CesiumJS\
**Created:** [January 28, 2024, 2:29pm UTC](https://community.cesium.com/t/using-cesium-npm-package-with-nuxt-3/29593 "2024-01-28T14:29:18Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![Jacques27](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/jacques27/32/11887_2.png) [@Jacques27](https://community.cesium.com/u/Jacques27)\
**Post date:** [January 30, 2024, 12:57am UTC](https://community.cesium.com/t/using-cesium-npm-package-with-nuxt-3/29593/3 "2024-01-30T00:57:52Z")

</div>

Hi Toby,

I have indeed and it’s a bit tedious to be honest and it was a lot of trial and error at first but I’ve built multiple projects with it already.

One thing you should probably add is a script to initialise the base URL instead of adding it to the nuxt.config.

> export default function setupCesiumBaseUrl() {  
> const cesiumBaseUrl = ‘./lib/cesium’;  
> window.CESIUM\_BASE\_URL = cesiumBaseUrl;  
> }

I’m calling this function right after imports in my app.vue.

I have also added a script that copies the necessary folders from the node\_modules when you build your app (requires packages “del” and “recursive-copy” to be installed:

> import copy from ‘recursive-copy’;  
> import { deleteSync } from ‘del’;
> 
> const baseDir = ‘node\_modules/cesium/Build/CesiumUnminified’;
> 
> const targets = [‘Assets/ **/\*', 'ThirdParty/** /_', 'Widgets/\*\*/_’, ‘Workers/\*\*/\*’, ‘Cesium.js’];
> 
> deleteSync(targets.map((src) =\> `.output/public/lib/cesium/${src}`));
> 
> copy(baseDir, ‘.output/public/lib/cesium’, {  
> expand: true,  
> overwrite: true,  
> filter: targets,  
> });

In order to get it running in dev mode instead of building it every time, I’ve also added a “lib” folder at the project root which includes the same as what the script above copies. Below is what my folder structure looks like.

 ![image](https://global.discourse-cdn.com/cesium/original/3X/e/3/e3c071fa6032660af2fce40bb1dfb542de568bd5.png)

Note: My latest cesium project is running with nuxt 3.6.5 and I have not tried this with newer versions of nuxt yet.

Sorry for the short answer, not much time currently, hope it helps.

Best,  
Jacques

---

_[View the full topic](https://community.cesium.com/t/using-cesium-npm-package-with-nuxt-3/29593)._
