ASP.NET MVC、AngularJS、Bower 和部署站点文件夹结构

Question

我已经阅读了很多关于站点文件夹结构（开发和部署）的文章和问题，但仍然对以下问题有误解。

我标记了我当前的文件夹结构：

• Orange- 看起来像lib或vendor文件夹，我想在其中存储独立组件；
• Blue- 文件夹包含我自己的，相对于当前项目（应用程序）文件；
• Green-ready to deploy 文件夹，其中包含缩小和合并的文件，这些文件曾经包含在 index.html 中。

有几个问题我想找到答案：

• 是否正确，最佳实践是仅部署到 Web 服务器的dist文件夹？
• 我应该将我的bower_components和app javascript 文件合并到单个 app.min.js 文件中吗？我应该将独立组件与应用程序文件和 ober 排序混淆吗？
• 我应该将带有模板的视图文件夹按原样部署到dist/views文件夹中吗？
• 将所有图像（css 图像、应用程序图像、插件图像）混入单个dist/images文件夹是否正确？
• 在视图文件夹中存储指令模板是否正确？
• 没有相对于 AngularJS client/app/js/common/helpers.js文件，-我不知道哪里是最明显的地方（它可能是原型、自定义函数或对象）

我会很高兴得到任何帮助，ty。

Answer 1

这是我正在构建的名为Simple Team的有角度网站的目录结构，该网站使用 Browserify 绑定在一起。

这是我的文档根目录，我的框架在其中启动并提供公共文件。我所有的 JS 和 HTML 都绑定到了app.min.js.

这就是我将指令构建为带有视图的模块的方式require()。

"use strict"

require('moment')
require('angular-ui-router')
require('angular-ui-sortable')
require('angular-gravatar')
require('angular-elastic')
require('angular-local-storage')
require('angular-moment')

require('./routes.js')
require('./modules/focusMe')
require('./modules/selectize')
require('./modules/tagData')
require('./modules/www')
require('./modules/uiSrefActiveIf')

angular
    .module('simple.team', [
        'ngFileUpload',
        'ui.router',
        'ui.sortable',
        'ui.gravatar',
        'ui.bootstrap',
        'selectize',
        'angularMoment',
        'angular-loading-bar',
        'ng-showdown',
        'LocalStorageModule',
        'monospaced.elastic',
        'textAngular',

        'simple.team.uiSrefActiveIf',
        'simple.team.routes',
        'simple.team.focusMe',
        'simple.team.ngBindHtmlUnsafe',
        'simple.team.bytes',
        'simple.team.strings',
        'simple.team.auth',
        'simple.team.tagData',
        'simple.team.userData',
        'simple.team.www'
    ])
    .config(function($urlRouterProvider, cfpLoadingBarProvider) {
        $urlRouterProvider.otherwise('/projects')
        cfpLoadingBarProvider.includeSpinner = false
    })
    .controller('AppCtrl', function($state, $http, $rootScope) {
        // Controller code
    })

路线和控制器

angular
    .module('simple.team.routes', [])
    .config(function($stateProvider) {
        $stateProvider
            .state('projects', {
                url: '/projects',
                template: require('./layouts/projects.html'),
                controller: ProjectsCtrl,
                controllerAs: 'ctrl'
            })
            .state('projects.card', {
                url: '/card/?cardId',
                template: require('./layouts/card.html'),
                controller: require('./controllers/card.ctrl.js'),
                controllerAs: 'ctrl'
            })