我公司的生产是一个使用Angular的网络应用程序。当我开始使用CMD服务时,处理速度非常慢。我下载了一个名为ng-alain的开源管理模板。https://github.com/cipchk/ng-alain 并且服务它。它非常快.ng-alain的速度至少比我快7倍。 我使用命令ng-eject导出webpack-config.js,我发现我的配置的exclude和include包含许多第三方依赖包。如JQuery,Bootstrap等。但是ng-alain的配置只包含样式。减。 我比较了它们之间的angular-cli.json。如下。 矿:
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {"name": "abp-zero-template"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico",
{
"glob": "abp.signalr.js",
"input": "../node_modules/abp-web-resources/Abp/Framework/scripts/libs/",
"output": "./assets/abp/"
},
{
"glob": "**.*",
"input": "../node_modules/bootstrap-select/dist/js/i18n/",
"output": "./assets/localization/bootstrap-select/"
},
{
"glob": "**.*",
"input": "../node_modules/timeago/locales/",
"output": "./assets/localization/jquery-timeago/"
}
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.json",
"prefix": "app",
"styles": [
"../node_modules/simple-line-icons/css/simple-line-icons.css",
"../node_modules/font-awesome/css/font-awesome.css",
"../node_modules/famfamfam-flags/dist/sprite/famfamfam-flags.css",
"../node_modules/bootstrap-select/dist/css/bootstrap-select.css",
"../node_modules/jquery.uniform/dist/css/default.css",
"../node_modules/toastr/build/toastr.css",
"../node_modules/sweetalert/dist/sweetalert.css",
"../node_modules/jstree/dist/themes/default/style.min.css",
"../node_modules/morris.js/morris.css",
"../src/assets/Jcrop/css/Jcrop.css",
"../node_modules/bootstrap-daterangepicker/daterangepicker.css",
"../node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css",
"../src/app/shared/core.less",
"../src/app/shared/layout/layout.less",
"../src/assets/bootstrap-datepicker/css/bootstrap-datepicker.min.css",
"../node_modules/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css",
"../node_modules/primeng/resources/primeng.min.css",
"../node_modules/primeng/resources/themes/bootstrap/theme.css",
"../src/assets/primeng/datatable/css/primeng.datatable.css",
"../src/assets/primeng/file-upload/css/primeng.file-upload.css",
"../node_modules/quill/dist/quill.core.css",
"../node_modules/quill/dist/quill.snow.css",
"../node_modules/fullcalendar/dist/fullcalendar.min.css",
"styles.css"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/jquery-migrate/dist/jquery-migrate.min.js",
"../node_modules/jqueryui/jquery-ui.min.js",
"../node_modules/js-cookie/src/js.cookie.js",
"../node_modules/jstree/dist/jstree.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.js",
"../node_modules/bootstrap-select/dist/js/bootstrap-select.js",
"../node_modules/tether/dist/js/tether.min.js",
"../node_modules/lodash/lodash.min.js",
"../node_modules/moment/min/moment-with-locales.min.js",
"../node_modules/moment-timezone/builds/moment-timezone-with-data.min.js",
"../node_modules/signalr/jquery.signalR.js",
"../src/assets/Jcrop/js/Jcrop.js",
"../node_modules/morris.js/morris.min.js",
"../node_modules/raphael/raphael.min.js",
"../node_modules/jquery-sparkline/jquery.sparkline.min.js",
"../node_modules/toastr/toastr.js",
"../node_modules/sweetalert/dist/sweetalert-dev.js",
"../node_modules/block-ui/jquery.blockUI.js",
"../node_modules/spin.js/spin.min.js",
"../node_modules/spin.js/jquery.spin.js",
"../node_modules/bootstrap-daterangepicker/daterangepicker.js",
"../node_modules/jquery-slimscroll/jquery.slimscroll.min.js",
"../node_modules/timeago/jquery.timeago.js",
"../node_modules/localforage/dist/localforage.min.js",
"../node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js",
"../node_modules/push.js/bin/push.min.js",
"../node_modules/flot/jquery.flot.js",
"../node_modules/flot/jquery.flot.pie.js",
"../node_modules/flot/jquery.flot.resize.js",
"../node_modules/flot/jquery.flot.categories.js",
"../node_modules/flot/jquery.flot.time.js",
"../node_modules/waypoints/lib/jquery.waypoints.min.js",
"../node_modules/jquery.flot.tooltip/js/jquery.flot.tooltip.min.js",
"../node_modules/topojson/build/topojson.min.js",
"../node_modules/d3/d3.js",
"../node_modules/datamaps/dist/datamaps.world.min.js",
"../node_modules/easy-pie-chart/dist/easypiechart.js",
"../src/assets/common/scripts/horizontal-timeline/horizontal-timeline.js",
"../node_modules/abp-web-resources/Abp/Framework/scripts/abp.js",
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.js",
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.toastr.js",
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.blockUI.js",
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.spin.js",
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.sweet-alert.js",
"../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.moment.js",
"../src/assets/bootstrap-datepicker/js/bootstrap-datepicker.min.js",
"../node_modules/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js",
"../src/assets/metronic/global/scripts/app.js",
"../src/assets/metronic/admin/layout4/scripts/layout.js",
"../src/assets/metronic/layouts/global/scripts/quick-sidebar.js",
"../node_modules/jquery.inputmask/dist/jquery.inputmask.bundle.js",
"../node_modules/quill/dist/quill.js",
"../node_modules/echarts/dist/echarts.min.js",
"../node_modules/fullcalendar/dist/fullcalendar.js",
"../node_modules/fullcalendar/dist/locale/zh-cn.js"
],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"hmr": "environments/environment.hmr.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"files": "src/**/*.ts",
"project": "src/tsconfig.json"
},
{
"files": "e2e/**/*.ts",
"project": "e2e/tsconfig.json"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "css",
"component": {}
}
}
ng-alain的angular-cli.json如下
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "ng-alain"
},
"apps": [{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles.less"
],
"scripts": [
"../node_modules/@antv/g2/dist/g2.min.js",
"../node_modules/@antv/data-set/dist/data-set.min.js",
"../node_modules/@antv/g2-plugin-slider/dist/g2-plugin-slider.min.js"
],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts",
"hmr": "environments/environment.hmr.ts",
"chore": "environments/environment.chore.ts"
}
}],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [{
"project": "src/tsconfig.app.json",
"exclude": "**/node_modules/**"
},
{
"project": "src/tsconfig.spec.json",
"exclude": "**/node_modules/**"
},
{
"project": "e2e/tsconfig.e2e.json",
"exclude": "**/node_modules/**"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"schematics": {
"collection": "@delon/cli"
},
"styleExt": "less",
"class": {
"spec": false
},
"component": {
"flat": false,
"spec": false,
"inlineStyle": true,
"inlineTemplate": false
},
"directive": {
"spec": false
},
"guard": {
"spec": false
},
"interface": {
"prefix": "I"
},
"module": {
"spec": false
},
"pipe": {
"spec": true
},
"service": {
"spec": false
}
}
}
我想知道在ng-alain中添加了JQuery,Bootstrap等第三个pary的位置?为什么ng-alain可以比我的快得多?
答案 0 :(得分:0)
已解决。关键是Angular的版本。我的项目是V2 ...