Webpack构建Angular.js-无法实例化模块应用

艾米莉亚·赫勒(Emilia Heller-Mrotek)

我正在尝试将我们的angular.js构建从gulp迁移到webpack。我已经与供应商库成功捆绑,但是我遇到了angular.js模块的问题。

未捕获的错误:[$ injector:modulerr]由于以下原因未能实例化模块应用程序:错误:[$ injector:modulerr]由于以下原因而未能实例化模块app.product:由于错误:[$ injector:nomod]模块'app.product'为无法使用!您可能拼错了模块名称,或者忘记了加载它。如果注册模块,请确保将依赖项指定为第二个参数。

我应该如何导入它们,以便Webpack可以选择它们?

webpack.config.js

const   webpack = require('webpack'),
        path = require('path'),
        config = require('./config.json');

module.exports = {
    entry: './app/app.js',
    mode: 'development',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js'
    },
    plugins: [
        new webpack.DefinePlugin({
            PRODUCTION: JSON.stringify(false),
            VERSION: JSON.stringify(config.version),
            INTERCOME_ENABLED: JSON.stringify(true),
        })
    ],
};

我的app.js的一部分

const angular = require('angular');
window.jQuery = window.$ = require('jquery');
require('../node_modules/jquery-ui-dist/jquery-ui.js');
require('../node_modules/angular-ui-router/release/angular-ui-router.js');
require('../node_modules/bootstrap/dist/js/bootstrap.js');
require('../node_modules/angular-ui-bootstrap/dist/ui-bootstrap-tpls.js');
require('../node_modules/spin.js/spin.js');
require('../node_modules/autosize/dist/autosize.js');
require('../node_modules/jquery-validation/dist/jquery.validate.js');
require('../node_modules/jquery-validation/dist/additional-methods.js');
require('../node_modules/dropzone/dist/dropzone.js');
require('../node_modules/ng-mask/dist/ngMask.js');
require('../libs/nestable/jquery.nestable.js');
require('../node_modules/angular-sanitize/angular-sanitize.js');
require('../node_modules/ui-select/dist/select.js');
require('../libs/multi-select/jquery.multi-select.js');
require('../node_modules/angular-local-storage/dist/angular-local-storage.js');
require('../node_modules/datatables/media/js/jquery.dataTables.js');
require('../node_modules/drmonty-datatables-colvis/js/dataTables.colVis.js');
require('../node_modules/angular-datatables/dist/angular-datatables.js');
require('../node_modules/angular-datatables/dist/plugins/colvis/angular-datatables.colvis.js');
require('../node_modules/angular-datatables/dist/plugins/tabletools/angular-datatables.tabletools.js');
require('../node_modules/bootstrap-datepicker/dist/js/bootstrap-datepicker.js');
require('../node_modules/angular-xeditable/dist/js/xeditable.js');
require('../node_modules/ng-idle/angular-idle.js');
require('../node_modules/file-saver/FileSaver.js');
require('../node_modules/blob-polyfill/Blob.js');
require('../node_modules/inputmask/dist/jquery.inputmask.bundle.js');
require('../node_modules/clipboard/dist/clipboard.js');
require('../node_modules/mobile-detect/mobile-detect.js');
require('../node_modules/ng-scrollbar/dist/ng-scrollbar.min.js');
require('../node_modules/autofill-event/autofill-event.js');
require('../libs/wizard/jquery.bootstrap.wizard.min.js');
require('../libs/material-admin/App.js');
require('../libs/material-admin/AppForm.js');
require('../libs/material-admin/AppNavigation.js');

require('../node_modules/d3/build/d3.js');
require('../libs/morris/morris.js');
require('webpack-raphael');
require('../libs/select2/select2.js');
require('../libs/toastr/toastr.js');
require('../libs/polyfills/number.js');


(function(){
    /*(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

    var codeGA = 'UA-00000000-0';

    if (location.host.indexOf('app.pay2sender.com') >= 0) {
        codeGA = 'UA-85564384-1';
    } else if (location.host.indexOf('app-staging.pay2sender.com') >= 0 ) {
        codeGA = 'UA-85564384-2';
    } else if (location.host.indexOf('app-test.pay2sender.com') >= 0) {
        codeGA = 'UA-85564384-3';
    }else if (location.host.indexOf('imp-perf.puca.com') >= 0) {
        codeGA = 'UA-85564384-4';
    }

    ga('create', codeGA, 'auto');
    ga('send', 'pageview');*/


    if (JSON.parse(INTERCOME_ENABLED)) {
        var intercomAppId = 'qumf3d6m';
        (function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.push(args)};w.Intercom=i;function l(){var s=d.createElement('script');s.type='text/javascript';s.async=true;
            s.src='https://widget.intercom.io/widget/'+intercomAppId;
            var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);}if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})()
    }

}());

(function(){
    var app = angular.module('app',
        [   'ui.router',
            'ui.bootstrap',
            'ui.select',
            'ngSanitize',
            'ngScrollbar',
            'LocalStorageModule',
            'datatables',
            'app.product',
            'app.dashboard',
            'app.profile',
            'app.login',
            'app.clients',
            'app.users',
            'app.baseUrl',
            'app.forgottenPassword',
            'app.resetPassword',
            'app.payments',
            'app.locations',
            'app.filters',
            'templates',
            'app.paymentApi',
            'app.pgwSettings',
            'toastr',
            'app.directives',
            'app.billing',
            'app.utils',
            'xeditable',
            'ngIdle',
            'IntercomAnalytics',
            'app.sessionTime',
            'ngVersionApp',
            'app.developer',
            'app.manageTextTemplates',

            'appMM.profile',
            'appMM.dashboard',
            'appMM.messages',
            'appMM.manage',
            'appMM.users',
            'appMM.clients',
            'appMM.locations',
            'appMM.privacy',

        ])

        .run(function ($rootScope, $state, tokenService, product, uiSelectConfig, editableOptions, editableThemes, Idle, authService, sessionTimeService, $timeout, userService, $window, logoFeatureService) {
            uiSelectConfig.theme = 'select2';
    (the rest of the function here)

模块初始化

angular.module('app.product', [

    ]);
    angular.module('app.product', ['app.config'])
        .provider('product', function (CONST) {
(rest of the function)
艾米莉亚·赫勒(Emilia Heller-Mrotek)

原来,我需要对包含app.js中模块声明的文件做require语句,然后它开始工作。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

无法实例化模块Angular JS

无法实例化Angular js中的模块错误

Angular JS:由于以下原因无法实例化模块测试:

未捕获的错误:[$ injector:modulerr]无法在Apache上的Angular.js应用程序上实例化模块错误

使用Jasmine测试Angular服务:无法实例化模块应用

Angular.js无法实例化模块Thitch'Angular-File-Saver'

Angular JS:未捕获的错误:[$injector:modulerr] 无法实例化模块

Angular.JS:由于以下原因而无法实例化模块路由:错误:$ injector:nomod模块“路由”不可用

即使在package.json中定义了模块,由于在angular.js文件中发生了一些错误,也无法实例化模块

如何构建angular.js应用

无法为Angular实例化模块ui-bootstrap

使用 webpack 构建 angular 6 应用程序时出错

使用Webpack优化Angular 2应用程序的构建时间

Angular 9无法实例化循环依赖!应用参考

Node JS Webpack 构建失败

加载由webpack构建的Angular应用时_angular.angular未定义错误

模块化应用程序后,Angular JS控制器不起作用

Webpack无法编译-模块构建失败

无法实例化应用模块。为什么?

Webpack - CommonsChunkPlugin(lib 构建),common.js 未加载到父应用程序中

在基于Angular的Web应用程序的另一个JS文件中实例化JS类

即使我使用的是Angular版本1.3.0,也安装了Angular Material,“无法实例化模块ngMaterial”

实例化angular js控制器

无法在Angular JS中加载模块

无法在Coffeescript中创建Angular JS模块

在 webpack 构建过程后连接 JS 文件

webpack如何构建vue.js项目

使用webpack构建angular2应用-找不到./compiler.es5.ts

如何构建模块化应用