Объединение и минимизация в проектах ASP.Net Web API + AngularJS - PullRequest
Новая
       26

Объединение и минимизация в проектах ASP.Net Web API + AngularJS

0 голосов
/ 28 августа 2018

В нашей команде есть несколько проектов, но все они имеют одинаковую архитектуру, и недавно мы решили внедрить пакетирование и минимизацию во всех них.

поэтому мы используем ASP.Net Web API вместе с AngularJS и не используем ASP.Net MVC, поэтому не используем Razor или .cshtml.

В нашей папке приложения, которую мы используем для хранения файлов AngularJS, у нас есть этот файл Index.html, в котором мы ссылаемся на наш файл load-js-css.js, эта функция у нас в load-js-css.js для загрузить CSS-файлы вместе с App / main.js: 

function loadcssfile(filename, filetype) {
if (filetype == "js") {
    var fileref = document.createElement("script")
    fileref.setAttribute("data-main", "App/main.js")
    fileref.setAttribute("src", filename + "?v=" + version)
}
if (filetype == "css") {
    var fileref = document.createElement("link")
    fileref.setAttribute("rel", "stylesheet")
    fileref.setAttribute("type", "text/css")
    fileref.setAttribute("href", filename + "?v=" + version)
}
if (typeof fileref != "undefined")
    document.getElementsByTagName("head")[0].appendChild(fileref)
}

В main.js мы определяем наши пути, а также ссылку на app.js: 

require.config({
baseUrl: "Scripts",
paths: {
    'application': '/App/app',
    'jquery.min': 'kendoUI/js/jquery.min',
    'angular.min': 'kendoUI/js/angular.min',
    .
    .
    .
    .

    'momentJalaali': { deps: ['jquery.min', 'angular.min', 'moment'] },
    'pdfMakeLib': { exports: 'pdfMake' },
    'pdfmake' : {deps: ['pdfMakeLib'], exports: 'pdfmake'}
},
urlArgs: "v=" + ((isDevelopment) ? (new Date()).getTime() : version),
waitSeconds: 0,
deps: ['application']
});

и, наконец, в app.js мы определяем различные состояния со ссылкой на контроллеры AngularJS и HTML-файлы 

define(['angularAMD', 'angular-ui-route', 'ui-bootstrap', 'angular-sanitize', 'blockUI', 'animate', 'moment', 'momentJalaali', 'infoWindow', 'buttonValidation', 'textEmail', 'textNumeric', 'windowRedirect', 'dataService', "messageService", 'ncy-angular-breadcrumb', 'helperFactory'], function (angularAMD) {
"use strict";
var baseUrl = "App/views/", defaultOtherwise = 'default';
var app = angular.module("mainModule", ['ui.router', 'blockUI', 'ngSanitize', 'ui.bootstrap', 'ui.router.state', 'ncy-angular-breadcrumb'], ["$breadcrumbProvider", "blockUIConfig", "$stateProvider", "$urlRouterProvider", "$locationProvider", '$provide', function ($breadcrumbProvider, blockUIConfig, $stateProvider, $urlRouterProvider, $locationProvider, $provide) {
    $provide.constant("defaultUrlOtherwise", defaultOtherwise);
    $breadcrumbProvider.setOptions({
        prefixStateName: 'home',
        templateUrl: 'App/template/breadcrumb.html',
    });
    .
    .
    .
    .
    .state('login', angularAMD.route({
        url: '/login',
        controllerUrl: baseUrl + 'security/login/loginController.js',
        views: {
            'login': {
                templateUrl: baseUrl + 'security/login/login.html',
            }
        },
    }))
    .
    .
    .
    .

так что уже больше недели я ищу хороший способ включить пакетирование в наших проектах, но не могу найти хорошую практику, подходящую для наших проектов. Есть хороший способ сделать пакетирование для Web API + Проекты AngularJS?

А также мы не можем использовать .cshtml в нашем проекте, и без @ Render.Scripts мы должны использовать теги, которые, я думаю, будут проблемой из-за кэширования.

...