jsanahuja / InstagramFeed

Vanilla JavaScript Instagram Feed without access token. Not using the Instagram API
MIT License
318 stars 128 forks source link

Publish to npmjs and allow for import access #8

Closed JamesFreeman closed 4 years ago

JamesFreeman commented 4 years ago

Hi there, this looks like an amazing project.

I'm trying to install this into my project via yarn but it doesn't look like you've published it to a npmjs site and created a tagged release. Would it be possible to do this?

Also, would it be possible to give us the ability to import the project instead of having have a hardcoded .js in the header?

This would enable a developer to do something like this:

<script>
import InstagramFeed from 'jsanahuja/InstagramFeed';

export default{
    mount(){
        InstagramFeed({
            'username': 'instagram',
            'container': document.getElementById("instagram-feed1"),
            'display_profile': true,
            'display_biography': true,
            'display_gallery': true,
            'callback': null,
            'styling': true,
            'items': 8,
            'items_per_row': 4,
            'margin': 1 
        });
    }
}
</script>
dhruveonmars commented 4 years ago

Any idea if this has been done, or if it's in progress, or not happening?

I'd like to add it to a Shopify Custom Theme Section, so that it's not unnecessarily loaded on all pages.

jsanahuja commented 4 years ago

Added AMD support, please test it.

jsanahuja commented 4 years ago

You should now be able to install it using:

npm install jsanahuja/instagramfeed

Thank you both

dhruveonmars commented 4 years ago

Hey @jsanahuja Thanks for adding it, however after installing, and adding import { InstagramFeed } from "@jsanahuja/instagramfeed";, I get Module not found: Error: Can't resolve '@jsanahuja/instagramfeed'

jsanahuja commented 4 years ago

What is your environment? Vanilla JS, webpack, node? A repository example would be helpful

Thanks!

jsanahuja commented 4 years ago

I believe it should work now. I tested with webpack:

import InstagramFeed from '@jsanahuja/instagramfeed';

console.log(InstagramFeed);

const root = document.createElement("div")
root.id = 'instagram-feed'
document.body.appendChild(root)

new InstagramFeed({
    'username': 'instagram',
    'container': document.getElementById("instagram-feed"),
    'display_profile': true,
    'display_biography': true,
    'display_gallery': true,
    'callback': null,
    'styling': true,
    'items': 8,
    'items_per_row': 4,
    'margin': 1
});

Please try with the new @1.2.3 release Thank you!

robsonsobral commented 4 years ago

HI! Thank you for adding, but it looks like something is broken. I can't find the package on NPM.

ymongo commented 4 years ago

From https://yarnpkg.com/package/instafeed i got it workin gon nuxt.

Please update your doc: yarn add instafeed

then

import InstagramFeed from 'instafeed'

jsanahuja commented 4 years ago

From https://yarnpkg.com/package/instafeed i got it workin gon nuxt.

Please update your doc: yarn add instafeed

then

import InstagramFeed from 'instafeed'

That is not related to this repository

HI! Thank you for adding, but it looks like something is broken. I can't find the package on NPM.

For me it works using npm install jsanahuja/InstagramFeed

If you are trying as it shows here then you need to configure the github registry in your NPM:

npm config set registry https://npm.pkg.github.com/
npm install @jsanahuja/instagramfeed@1.4.0

Note that you will have to configure back your registry to install packages that are not in the github registry:

npm config set registry https://registry.npmjs.org/