VincentGarreau / particles.js

A lightweight JavaScript library for creating particles
https://vincentgarreau.com/particles.js/
MIT License
29.08k stars 4.83k forks source link

The object is empty after using "import" #265

Open rainbox-taojun opened 6 years ago

rainbox-taojun commented 6 years ago

particles {}proto: Object

index.js:9977 [Vue warn]: Error in mounted hook: "TypeError: WEBPACK_IMPORTED_MODULE_0_particlesjsdefault.a.particlesJS is not a function"

found in

---> at resources/assets/views/login/Login.vue

at resources/assets/App.vue warn @ index.js:9977 logError @ index.js:11130 globalHandleError @ index.js:11125 handleError @ index.js:11114 callHook @ index.js:12313 insert @ index.js:13487 invokeInsertHook @ index.js:15254 patch @ index.js:15473 Vue._update @ index.js:12053 updateComponent @ index.js:12181 get @ index.js:12531 Watcher @ index.js:12520 mountComponent @ index.js:12188 Vue$3.$mount @ index.js:17808 Vue$3.$mount @ index.js:20148 Vue._init @ index.js:13960 Vue$3 @ index.js:14049 apply @ index.js:54362 __webpack_require__ @ index.js:20 Object.defineProperty.value @ index.js:54322 __webpack_require__ @ index.js:20 BUILTIN_OBJECT.[object Function] @ index.js:63 (anonymous) @ index.js:66 index.js:11134 TypeError: __WEBPACK_IMPORTED_MODULE_0_particles_js___default.a.particlesJS is not a function at VueComponent.setBackground (index.js:106612) at VueComponent.boundFn [as setBackground] (index.js:9590) at VueComponent.mounted (index.js:106689) at callHook (index.js:12311) at Object.insert (index.js:13487) at invokeInsertHook (index.js:15254) at Vue$3.patch [as __patch__] (index.js:15473) at Vue$3.Vue._update (index.js:12053) at Vue$3.updateComponent (index.js:12181) at Watcher.get (index.js:12531)
leovafme commented 6 years ago

please demo a code for replicate

rainbox-taojun commented 6 years ago

I'm sorry, reply is slow. I am using the VUE. After I import, particles is empty object, I don't know the correct usage,But in a few months ago, so I use can be successful.

Here is my part of the code

import particles from 'particles.js'
import particlesJSON from './particles.json'
....
export default {
    name: 'login',
    data () {
        return {

        }
    },
    methods: {
        setBackground () {
            particles.particlesJS('login-bg', particlesJSON)
        },

    },
    created () {

    },
    mounted () {
        this.setBackground()
    }
}

image

blaskovicz commented 6 years ago

I don't think particles.js is designed to be imported since it assigns to window.particleJS and doesn't utilize module.exports

diogobd commented 4 years ago

this source code work

import 'particles.js'

declare var window:any;

@Component({ ...

async ionViewWillEnter() { window.particlesJS.load('particles-js', 'assets/particles.json'); }

..