Bug: Failed to resolve import "gmap-vue" from "resources/js/app.js". Does the file exist?

[geneowak]

Please complete all sections that you can but please don't remove any section, otherwise the bot will close your issue because it doesn't meet our issue template (you can remove this comment)

Describe the bug

I'm trying to use the package in a laravel 10 app with vue 3 as my front end and vite as my bundler but I can't get any of the examples in the docs to work.

To reproduce

Steps to reproduce the behavior:

1. Install package: npm install @gmap-vue/v3
2. Import GmapVue to set it up in app.js: import GmapVue from 'gmap-vue';
3. Run the vite server: npm run dev
4. See the error

   [vite] Internal server error: Failed to resolve import "gmap-vue" from "resources/js/app.js". Does the file exist?

Expected behavior

It should work as specified in the documentation

Current behavior

It fails to import the package components

Screenshots

If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information)

• OS: MacOs
• Browser: All
• Version: 1.0.3

Smartphone (please complete the following information)

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context

I'm using vite with the following configuration

import { defineconfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';

export default defineconfig({
    resolve: {
        alias: {
            '@': '/resources/js',
        },
        extensions: ['.gql', '.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
    },
    plugins: [
        laravel({
            input: 'resources/js/app.js',
            ssr: 'resources/js/ssr.js',
            refresh: true,
        }),
        vue({
            template: {
                transformasseturls: {
                    base: null,
                    includeabsolute: false,
                },
            },
        }),
    ],
});

PS: The same error happens in any vue 3 project so it's not a laravel issue but an issue with the v3 version of the package. Checking through the code it seems the v3 version of the package doesn't export the functions mentioned in the documentation.

Versions

• Node: v16.13.0
• NPM: 8.11.0
• Yarn: -

Package manager

• [x] NPM
• [ ] Yarn

Plugin version

• [ ] 1.4.x
• [ ] 1.2.x
• [x] 1.0.x

[create-issue-branch[bot]]

Branch issue-308-Bug_Failed_to_resolve_import_gmap-vue_from_resources/js/app_js_Does_the_file_exist created!

[Peque]

@geneowak Did you find a workaround for this?

[geneowak]

@Peque Looking at the code of that version it seems the v3 version uses GmapVuePlugin instead of GmapVue and when you look here you can see the names of the new components but I've not really got to try them out because I don't know if things will change or not because they are not in the docs.

In the meantime I've been looking at an alternative package, the package was last updated (at the time of writing) updated a year ago but you can check out their github here... This package seems to be in active development so if @diegoazh, the author, clarifies which docs the v3 version should use, then I'd be happy to use this one.

[diegoazh]

I didn't have the time to update the new documentation yet. If you check the source code, it is written in typescript and I tried to add jsdoc comments to all public functions to document them. I trying to read and debug the bugs reported but I only have a few hours per week, almost for now. Please remember that PRs are welcome and also help to build the new documentation page. I apologize for this.

[diegoazh]

Hello @Peque and @geneowak, could you test our new version v2.0.0? also, you can find the main points on our new documentation site.

[diegoazh]

New documentation of the plugin https://diegoazh.github.io/gmap-vue/docs/vue-3-version/

[diegoazh]

I'm going to close this issue. Feel free to re-open it if something new happens.

[geneowak]

@diegoazh we very much appreciate all your efforts and are very grateful for your hard work. I will definitely be contributing once I get comfortable with typescript. I will be testing out the new docs soon and giving you feedback.