Don't work in webpack?

[alexsandro-xpt]

I'm trying require ngtable script at my project with webpack an ngTable can not recognize the angular lib, so then I remove this code https://github.com/esvit/ng-table/blob/master/src/scripts/intro.js to work..

What's wrong?

[diego-toro]

you could try this, https://github.com/webpack/imports-loader works for me like this require('imports?define=>false,angular!ngTable');

[marcincichocki]

@IngenieroLata Could you give me some insights about your solution? I was trying to implement this however it is not working with latest version(1.0.0.beta.9). Here is my SO question with more info.

[diego-toro]

Oh It's just that using imports-loader you can tell webpack to disable non-common modules (old ones), I'll check it out and let you know, looks like something has change and imports-loader is not loading ng-table properly

[diego-toro]

Ok I just checked and looks like the ng-table doesn't have and index for the module, so it's looking for the module and can't fine anything, it's better if you use something like this

// app.js
import angular from 'angular';
import ngTable from 'ng-table/dist/ng-table';

angular.module('app', [ngTable]);

without the imports-loader or, if you want to ensure using angular as global, use imports-loader with some resolve for ng-table, like this:

// webpack.config.js
 resolve: {
    extensions: ['', '.js'],
    alias: {
      'ng-table': 'ng-table/dist/ng-table'
    }
  },
 module: {
    loaders: [
      {
        test: /\.js$/,
        loaders: ['imports?angular', 'babel-loader'],
        exclude: /node_modules/
      }
    ]
  },

// app.js
// import angular from 'angular';
import ngTable from 'ng-table';

angular.module('app', [ngTable]);

[sairam]

The above solution did not quite work for me. babel-loader was not useful. running webpack fails mentioningimportis a reserved keyword.

I had to include the latest version of imports-loader . webpack.config.js

config.resolve = {
  extensions: ['', '.js'],
  alias: {
    'ng-table': 'ng-table/dist/ng-table'
  },
  modulesDirectories: [ 'node_modules', 'bower_components' ],
};

config.module = {
  loaders: [{
    test: require.resolve('ng-table'),
    loader: 'imports-loader?define=>false,$=jquery,angular'
  }]
}

In my app.js .

angular.module('app', ['ngTable']);

Also copied the solution to http://stackoverflow.com/a/42423676/208928

[bamtron5]

we need a simple solution for complex modules that include different files. Are we truley responsible for engineering a solution for webpack to import complex packages like this?

I see a very crazy demo here. https://github.com/esvit/ng-table/blob/master/demo-apps/ts-webpack/readme.md

[sairam]

My solution works for Webpack1 .