angularjs - バウアーをサポートする Webpack

Question

できれば node パッケージをロードしますか?存在しない場合にのみ、bower パッケージをロードします。

Webpack サイトで推奨されているノード パッケージのみを使用しますが、bower、https://github.com/Stamplay/stamplay-js-sdk および https://github.comにあるライブラリをロードする必要があります。 /Stamplay/angular-stampplay

bower-webpack-plugin で試す

https://github.com/lpiepiora/bower-webpack-pluginをインストールしました

しかし、実行webpack-dev-server -d --watchするとエラーが chrome コンソールに表示されます:

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.

ResolverPlugin を試してください ( Webpack のドキュメントを参照)

webpack.configに追加します..

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')
    ],

しかし、ここで述べたように、Stamplayオブジェクトは正しくありません!

CDN と angular-webpack-plugin を試す

最初に script タグをindex.html..に追加します。

次に、webpack.config に外部を追加します。

externals: {
    stamplay: 'Stamplay'
},

そして最後に.. new AngularPluginwebpack.configpluginsに

このように動作しますが、使用できません。angular-stamplay試してみると、モジュールstamplayapper でエラーが発生します。:(

ここでこの変更を含むブランチを参照してください

完全なプロジェクトはこちら: https://github.com/Ridermansb/webpackBowerStarter