katik/thumbnail-slider

Error Importing ThumbnailSlider

stevepop opened this issue · 2 comments

I tried importing this package in my Vue application but when compiled with webpack (using Laravel Mix) I got the following errors;

 ERROR  Failed to compile with 1 errors
This dependency was not found in node_modules:
* ThumbnailSlider
Did you forget to run npm install --save for it?

I can confirm that it is installed and in my npm-modules. This is an extract of my package.json

 "thumbnail-slider": "^0.1.2",
    "vue-chartjs": "^2.3.2",
    "vue-cookie": "^1.1.3",
    "vue-date": "^1.0.4",

This is where I am using it;


<script>
    import Vue from 'vue'
    import axios from 'axios'
    import moment from 'moment'
    import { TnSlider, TnItem } from 'ThumbnailSlider';

    export default{
        props: ['featured'],

        components: { TnSlider, TnItem},

        data(){
            return{
                competitions: [],
                showUrl:"",
            }
        },

        mounted() {
            this.competitions = this.featured;
        },

        methods: {
            getUrl(competition) {
                return `/competition/${competition.slug}`;
            },

            ending(competition) {
                return moment(competition.end_date).format('DD/MM/YYYY');
            }
        }
    }
</script>

I am not sure what the problem is but perhaps you do, which is why I am positing it here.
Thanks for the good work.

Having similar issues, using a stack based on browserify, babelify, vueify, and vue-hot-reload, etc. I get Error: Cannot find module 'ThumbnailSlider' from 'C:\dev\project\src'

My import statement is import { TnSlider, TnItem } from 'ThumbnailSlider';. Other modules, like axios, import fine.

katik commented

sorry for the inconvenience here. @stevepop @dpfavand
I made two mistakes.
first, in package.json, i put the wrong entry, so i fixed "main: index.js" to "/dist/thumbnailSlider.min.js".
secondly, import { TnSlider, TnItem } from 'ThumbnailSlider'; should be import { TnSlider, TnItem } from 'thumbnail-slider'; . because in node_modules the package name is thumbnail-slider NOT ThumbnailSlider. But i export in Global variable as ThumbnailSlider.
I've updated the npm package and README, and test it again by myself. I think it works fine now.
Hope u work fine.