Does anyone know why am I getting Module should export a function: @turf/helpers when I add @turf/helpers to my buildModules in nuxt.config.js?

// nuxt.config.js

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: [
  ],

  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [
    // https://go.nuxtjs.dev/tailwindcss
    '@nuxtjs/tailwindcss',
    '@turf/helpers'
  ],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [
  ],

Am I adding the module to the wrong array?

FYI: the module is present within my package.json / dependencies. Thus, the installation went through.

// Component where import { point } from '@turf/helpers' returns undefined

<script>
import { defineComponent } from '@vue/composition-api';
import mapboxgl from 'mapbox-gl';
import { point } from '@turf/helpers'

export default defineComponent({
    data () {
        return {
            geojson: {
                'type': 'FeatureCollection',
                'features': []
            },
            map: null,
        }
    },
    mounted() {
        this.initMapBox();
    },
    methods: {
        // Initialize MapBox map
        initMapBox: function() {
            mapboxgl.accessToken = 'pk.eyJ1IjoiYWxleGFuZHJ1YW5hIiwiYSI6ImNrZTl3NzJ3bzIxNG4yc2w2aG03dHNkMDUifQ.xaSxrVMLZtfGAlWoGvB1PQ';
             this.map = new mapboxgl.Map({
                container: 'map',
                style: 'mapbox://styles/alexandruana/cksxeq0637zjy17tcvd4h919d',
                center: [22.253, 45.419],
                zoom: 4
            });

            this.map.on('load', () => {
                console.log('Map loaded.')
                let point = point([22.253, 45.419]);
                console.log(point)

                this.map.addSource('points', {
                    type: 'geojson',
                    data: this.geojson
                });
                 this.map.addLayer({
                    id: 'points',
                    type: 'circle',
                    source: 'points',
                    paint: {
                        'circle-radius': 8,
                        'circle-color': '#00a9e2'
                    },
                    filter: ['in', '$type', 'Point']
                });


            });
        },
    }
    
})

CodePudding user response：

Importing it as a regular NPM package and using it without colliding with the same variable name fixed the issue!

Indeed, this was not a Nuxt module.