Closed ghost closed 7 years ago
In bootstrap-timepicker. js I get jQuery is not defined.
I have a common angular module that I import into my main module. The common module has components that use the date-time component.
In my common.module.ts class, I've imported the files in the order required.
import 'jquery/dist/jquery.min.js'; import 'bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js'; import 'bootstrap-timepicker/js/bootstrap-timepicker.js'; import { NKDatetimeModule } from 'ng2-datetime/ng2-datetime';
My webpack.config.vendor.js is below.
var isDevBuild = process.argv.indexOf('--env.prod') < 0; var path = require('path'); var webpack = require('webpack'); var ExtractTextPlugin = require('extract-text-webpack-plugin'); var extractCSS = new ExtractTextPlugin('vendor.css'); module.exports = { resolve: { extensions: ['', '.js'] }, module: { loaders: [ { test: /\.(png|woff|woff2|eot|ttf|svg)(\?|$)/, loader: 'url-loader?limit=100000' }, { test: /\.css(\?|$)/, loader: extractCSS.extract(['css']) }, { test: require.resolve('jquery'), loader: 'expose?jQuery!expose?$' } ] }, entry: { vendor: [ '@angular/common', '@angular/compiler', '@angular/core', '@angular/http', '@angular/platform-browser', '@angular/platform-browser-dynamic', '@angular/router', '@angular/platform-server', 'angular2-universal', 'angular2-universal-polyfills', 'bootstrap', 'bootstrap/dist/css/bootstrap.css', 'es6-shim', 'es6-promise', 'jquery', "jquery-slimscroll", 'lodash', 'moment', 'ng2-datetime', 'zone.js', ] }, output: { path: path.join(__dirname, 'wwwroot', 'dist'), filename: '[name].js', library: '[name]_[hash]', }, plugins: [ extractCSS, new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' , "window.jQuery": "jquery"}), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable) new webpack.optimize.OccurenceOrderPlugin(), new webpack.DllPlugin({ path: path.join(__dirname, 'wwwroot', 'dist', '[name]-manifest.json'), name: '[name]_[hash]' }) ].concat(isDevBuild ? [] : [ new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }) ]) };
Do you have any ideas why jQuery would not be picking up. Using expose-loaded or webpack.ProviderPlugin both fail to work.
Yeah same issue here...
Try to remove new webpack.optimize.OccurenceOrderPlugin()
new webpack.optimize.OccurenceOrderPlugin()
@nkalinov , thanks. I'll check it out.
In bootstrap-timepicker. js I get jQuery is not defined.
I have a common angular module that I import into my main module. The common module has components that use the date-time component.
In my common.module.ts class, I've imported the files in the order required.
My webpack.config.vendor.js is below.
Do you have any ideas why jQuery would not be picking up. Using expose-loaded or webpack.ProviderPlugin both fail to work.