6

Would I like to load preferably the node packages, and only if not exist, loads the bower package.

I would just use the node package only as recommended in Webpack site, but I need to load a library that is just in bower, https://github.com/Stamplay/stamplay-js-sdk and https://github.com/Stamplay/angular-stamplay

Try with bower-webpack-plugin

I installed https://github.com/lpiepiora/bower-webpack-plugin

But when I run webpack-dev-server -d --watch the error is displayed in chrome console:

Uncaught TypeError: angular.module is not a function(anonymous function) @ app.js:8__webpack_require__ @ bootstrap 6cecf8d96fb5a1205f10:19(anonymous function) @ bootstrap 6cecf8d96fb5a1205f10:39__webpack_require__ @ bootstrap 6cecf8d96fb5a1205f10:19(anonymous function) @ bootstrap 6cecf8d96fb5a1205f10:39(anonymous function) @ bootstrap 6cecf8d96fb5a1205f10:39
angular.js:68Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:nomod] Module 'app' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Try with ResolverPlugin (see Webpack docs)

In webpack.config i add..

plugins: [
     ...
    , new webpack.ProvidePlugin({
        Q: 'q',
        store: 'store.js',
        Stamplay: 'stamplay-js-sdk'
    })
    , new webpack.ResolverPlugin(
        [
            new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin("bower.json", ["main"])
        ], ["normal", "loader"]
    )

],
....
resolve: {
    root: [
        path.join(__dirname, 'node_modules'),
        path.join(__dirname, 'bower_components')
    ],

But, like mention here the Stamplay object is not correct!

Trying with CDN and angular-webpack-plugin

First add script tag into index.html ..

Second, add externals in webpack.config ..

externals: {
    stamplay: 'Stamplay'
},

And finally .. new AngularPlugin into plugins on webpack.config

This way, worsks but I cant use angular-stamplay, when I try, a error in module stamplay apper. :(

See branch with this change here

The full project is here: https://github.com/Ridermansb/webpackBowerStarter

ridermansb
  • 10,779
  • 24
  • 115
  • 226

1 Answers1

2

Ok, tried your project from git https://github.com/Ridermansb/webpackBowerStarter

And as mentioned at https://github.com/lpiepiora/bower-webpack-plugin/issues/20 I too had that Cannot resolve module 'stamplay-js-sdk' issue , then in webpackBowerStarter directory I did bower install stamplay-js-sdk then sudo npm run build and voila! It was done.

On npm run start which is same as webpack-dev-server -d --watch I get http://localhost:8080/webpack-dev-server/ like http://localhost:8080/webpack-dev-server/ And console says enter image description here

sry if u meant something else. Does this resolves your issue ?

Aishwat Singh
  • 4,331
  • 2
  • 26
  • 48
  • Hi @aishwat, something is wrong .. even in your screenshot, you can see that there is no `init` function in `Stamplay` object. In [stamplay-js-sdk](https://github.com/Stamplay/stamplay-js-sdk) docs, this function exist. Even if you expand the object details, you see that this is not a Stamplay object. Check the issue https://github.com/Stamplay/stamplay-js-sdk/issues/15 – ridermansb Nov 05 '15 at 21:17
  • ok if i do a simple `` at `index.html` `Stamplay.init("APPID"); ` at index.html works but without it it doesn't. AND from stamplay.js i can get `function(win){ })` objects get attached because it's at global/window scope `Function('return this')()` .However just next function `(function (root) {})(this) ` doesn't append init to Stamplay because it's in `this` context – Aishwat Singh Nov 06 '15 at 09:27
  • one lame fix , in stamplay.js before `;(function(win){` define `var that` then set `that=store` inside `;(function(win){` then in `(function (root) {` put `that.init=root.Stamplay.init;` then u get `Stamplay.init` working. I don't know what u want to do with init :D – Aishwat Singh Nov 06 '15 at 10:40
  • Thanks .. I will try it. I would just use the `Stamplay` object as [in the documentation](https://stamplay.com/docs/jssdk#intro-install) :) Not only `Stamplay.init("APPID");` but all apis for `Stamplay` object.. like `new Stamplay.Cobject('dinner').Model;` – ridermansb Nov 06 '15 at 11:32
  • @Ridermansb but it wasn't working so y accept ? did u get some fix ? – Aishwat Singh Nov 10 '15 at 12:16
  • The problem is in how the StamplaySDK exposes its api. The Webpack side is configured correctly, so I decided to accept your answer. I [opened a issue on github](https://github.com/Stamplay/stamplay-js-sdk/issues/15) about this problem. – ridermansb Nov 10 '15 at 13:05