0

Структура моего проекта:

enter image description here

Конфигурация webpack (webpack.config.js)

var ExtractTextPlugin = require('extract-text-webpack-plugin'),
    webpack = require('webpack');

module.exports = {
    entry: [
        './src/app.js',
    ],
    output: {
        path: __dirname + '/../web/js',
        filename: 'build.js',
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader'
            },
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: "css-loader"
                })
            },
            {
                test: /\.png$/,
                loader: "url-loader?limit=100000"
            },
            {
                test: /\.jpg$/,
                loader: "file-loader"
            },
            {
                test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/,
                loader: 'url-loader?limit=10000&mimetype=application/font-woff'
            },
            {
                test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
                loader: 'url-loader?limit=10000&mimetype=application/octet-stream'
            },
            {
                test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
                loader: 'file-loader'
            },
            {
                test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
                loader: 'url-loader?limit=10000&mimetype=image/svg+xml'
            },
        ]
    },
    plugins: [
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            'window.jQuery': "jquery"
        }),
        new ExtractTextPlugin('build.css')
    ]
}

Файл app.js (точка входа для webpack)

import 'babel-polyfill';

import $ from 'jquery';
window.$ = $;

import 'jquery-ui-dist/jquery-ui';

import 'bootstrap/dist/js/bootstrap.js';
import 'bootstrap/dist/css/bootstrap.css';

import 'angular';
import 'angular-ui-sortable';

import './styles.css'
import './controller/app.js'

Это корневой файл для angular (controller/app.js)

import './racks.js'
import './deletedRacks.js'
import './switches.js'
import './deletedSwitches.js'

const myApp = angular.module(
    'myApp',
    [
        'RacksListController',
        'DeletedRacksListController',
        'SwitchesListController',
        'DeletedSwitchesListController',
        'ui.sortable'
    ],
    function($interpolateProvider) {
        $interpolateProvider.startSymbol('[[');
        $interpolateProvider.endSymbol(']]');
    }
);

Один из контроллеров (для примера взял deletedRacks.js, все с подобной структурой)

(function (window, angular) {
    'use strict';
    angular.module('DeletedRacksListController', []).controller('DeletedRacksListController', [
        '$scope', '$http', function ($scope, $http) {
            $scope.racks = [];

            $scope.init = () => {
                $http({
                    method: 'GET',
                    url: Routing.generate('racks_get_deleted')
                }).then((response) => {
                    $scope.racks = response.data;
                }, (e) => {
                    console.log(e)
                });
            };

            $scope.restore = (rack) => {
                $http.post(Routing.generate('racks_toggle_delete', {id: rack.id, token: rack.token})).then((response) => {
                    rack.delete = false;
                }, (e) => {
                    console.log(e)
                });
            };
        }
    ])
})(window, window.angular);

Когда производу сборку в dev mode - все работает прекрасно. Нет никаких ошибок в консоле. Когда я собираю проект в production mode (npm run build) - проект так же собирается без ошибок, но в консоле вижу следующее:

Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:

Error: [$injector:unpr] Unknown provider: t

http://errors.angularjs.org/1.6.4/$injector/unpr?p0=t

Надеюсь на вашу помощь.

1 ответ 1

0

Была проблема в controller/app.js. Нужно было инжектить $interpolateProvider. Правильный файл:

const myApp = angular.module(
    'myApp',
    [
        'RacksListController',
        'DeletedRacksListController',
        'SwitchesListController',
        'DeletedSwitchesListController',
        'ui.sortable'
    ]
);

myApp.config(['$interpolateProvider', function($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
}]);

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.