Question

我正在开展一个小型的角度项目

并使用以下方法导入ngRoute：

npm install angular-route -S

我的index.js看起来像是：

import angular from 'angular';

import {nv_morts} from './components/calculator/mortsList/morts';

import 'angular-route/angular-route';


angular.module('app.starter', ['ngRoute'
]).config(function ($routeProvider) {
    $routeProvider
        .when("/Calculators", nv_morts);
});

webpack.config：

 module: {
     loaders: [

       // load and compile javascript
       { test: /\.js$/, exclude: /node_modules/, loader:"babel", query: { presets: ['es2015', 'stage-1'] } },

       // load css and process less
       { test: /\.css$/, loader: "style!css"},

       // load JSON files and HTML
       { test: /\.json$/, loader: "json" },
       { test: /\.html$/, exclude: /node_modules/, loader:"raw" },

       // load fonts(inline base64 URLs for <=8k)
       { test: /\.(ttf|eot|svg|otf)$/, loader: "file" },
       { test: /\.woff(2)?$/, loader: "url?limit=8192&minetype=application/font-woff"},

       // load images (inline base64 URLs for <=8k images)
       {test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192'}
     ]   }

我在package.json

中有一个脚本

"scripts": {
    "prestart": "npm install",
    "start": "webpack-dev-server",
    "bundle": "cp src/index.html dist/ & webpack -p ./dist/bundle.js"
  }

当我在本地工作时（localhost：8080）一切正常当我执行命令

npm run build

它构建文件index.html＆amp; bundle.js in＆＃34; dist＆＃34;夹

但是当我把这个归档到IIS文件夹中时我得到了：

由于以下原因导致无法实例化模块app.starter：错误：[$ injector：unpr]未知提供者：t

如果我删除对ngRoute的依赖，它在IIS上运行正常

为什么它不包括最终bundle.js中的ngRoute？

谢谢你们

Answer 1

好的所以我解决了它： - ）

问题在于缩小和注释。

此链接AngularJs Minification & Annotation

非常有帮助。

我的代码没有使用缩小安全依赖项。

例如：

我应该在index.js中

：

.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        .when("/Calculators", nv_morts)}]);

当我向其他服务注入服务时，我需要使用与index.js相同的模式

在我注入服务的组件内部我需要使用$ inject

例如：

class mortsController {

    /* @ngInject */
    constructor(MortsMngr) {
        this.newMortName = '';
        this.mortsManager = MortsMngr;
        this.savedMorts = MortsMngr.mortsList;

        MortsMngr.fetchMortsList();
    }  
}

mortsController.$inject = ['MortsMngr'];

export const nv_morts = {
    bindings: {},
    template: template,
    controller: mortsController,
    controllerAs: 'Morts'
}

注意这一行：

mortsController。$ inject = ['MortsMngr'];

做出了与众不同的事。

希望它能帮助任何人

angularjs不包括node_modules（缩小和注释）

1 个答案: