Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem with webpack #1319

Closed
Dodelkin opened this issue Sep 14, 2015 · 13 comments

Comments

@Dodelkin
Copy link

commented Sep 14, 2015

I try =>
import BootstrapDateTimePicker from "eonasdan-bootstrap-datetimepicker"; and console.log(BootstrapDateTimePicker);
And console.log return me empty object.

I try =>
import from "eonasdan-bootstrap-datetimepicker";
But i have Uncaught TypeError: $(".picker").datetimepicker is not a function

Please add module.exports = $.fn.datetimepicker;
to 2551 line

@Eonasdan

This comment has been minimized.

Copy link
Owner

commented Sep 14, 2015

I have no idea what you're talking about.

@alxrm

This comment has been minimized.

Copy link
Contributor

commented Sep 15, 2015

Hi, look, I met the same problem. That's what he tried to say.

He tried to import your plugin via require, but he gets empty object, when he did.

So he asks you to add module.exports

Regards!

@Eonasdan

This comment has been minimized.

Copy link
Owner

commented Sep 15, 2015

I don't know anything about require or webpacks. You're welcome to put in a pull request

@alxrm

This comment has been minimized.

Copy link
Contributor

commented Sep 15, 2015

Well, I did pull-request which solves this problem. Hope you'll accept it ASAP.
Thanks in advance!

@Dodelkin Dodelkin closed this Sep 19, 2015

@JanMalte

This comment has been minimized.

Copy link

commented Mar 14, 2016

@alxrm Could you link to the PR or state if it is already merged?

@alxrm

This comment has been minimized.

Copy link
Contributor

commented Mar 14, 2016

@JanMalte

This comment has been minimized.

Copy link

commented Mar 15, 2016

@alxrm Thanks. It looks like it wasn't merged but rejected.
Did you get this date picker to properly working with webpack?

@prijkes

This comment has been minimized.

Copy link

commented Mar 28, 2016

I ran into the same problem, and managed to solve/(hack around) it as follow:

  • Create a new folder in the same folder as your node_modules, but call it custom_modules
  • Inside the custom_modules folder, add a new folder eonasdan-bootstrap-datetimepicker
  • Move the following files into custom_modules/eonasdan-bootstrap-datetimepicker
node_modules/eonasdan-bootstrap-datetimepicker/src/js/bootstrap-datetimepicker.js
node_modules/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.css
  • uninstall the eonasdan-bootstrap-datetimepicker project from node_modules
  • In your webpack config, add the following:

Under plugins, add:

  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    'windows.jQuery': 'jquery'
  })

Under resolve, add:

    modulesDirectories: ['custom_modules', 'node_modules'],
    alias: {
      'datetimepicker': 'eonasdan-bootstrap-datetimepicker/bootstrap-datetimepicker.js'
    }
  • In the component you're using the datepicker, add the following at your imports:
import 'datetimepicker';
import 'style!css!eonasdan-bootstrap-datetimepicker/bootstrap-datetimepicker.css';
  • You should now be able to call the datetimepicker() on a jQuery object.
@aburkut

This comment has been minimized.

Copy link

commented Apr 11, 2016

I ran into the same problem too. Datetimepicker tries to load its own jQuery.
So the solution is very simple:

resolve: {
    alias: {
        'jquery': path.join(__dirname, 'node_modules/jquery/dist/jquery'),
    }
}
@kebian

This comment has been minimized.

Copy link

commented Sep 30, 2016

@aburkut Thank you. I've been pulling my hair out for about 24 hours and that little alias fixes everything. My webpack.config.js:

var path = require('path');

module.exports = {
    resolve: {
        alias: {
            // Force all modules to use the same jquery version.
            'jquery': path.join(__dirname, 'node_modules/jquery/src/jquery')
        }
    }
};
@sebastiaanluca

This comment has been minimized.

Copy link

commented Oct 23, 2016

Man, I've been looking for this solution for the past few hours. None of the plugins (datetimepicker, popover, tooltips) wanted to work and I always got a Uncaught TypeError: $(…).datetimepicker is not a function-like error. Had to be Webpack messing things up.

THANK YOU @aburkut

@SlyNet

This comment has been minimized.

Copy link

commented Jan 27, 2017

Is there an example on usage of this plugin with webpack?

@alshuwaikhat

This comment has been minimized.

Copy link

commented Feb 21, 2017

@kebian If I could like your post 1000+ times, I would've done so!
Thank you

Repository owner locked and limited conversation to collaborators Jun 17, 2017

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
10 participants
You can’t perform that action at this time.