- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
我有一个 SystemJS 项目。我使用 NGC 和 Rollup 进行 AOT 编译。一切正常,但用于路由的延迟加载不起作用。比如我的tsconfig-aot.json
{
"compilerOptions": {
"target": "es5",
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [ "es2015", "dom" ],
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true,
"baseUrl": ".",
"paths": {
"app/*": [ "../src/app/*" ]
}
},
"typeRoots": [
"node_modules/@types"
],
"files": [
"../src/app/app.module.aot.ts"
],
"exclude": [
"node_modules",
"typings"
],
"angularCompilerOptions": {
"genDir": "../",
"skipMetadataEmit": false,
"skipTemplateCodegen": false
}
}
和rollup.config.app.js
'use strict';
import nodeResolve from 'rollup-plugin-node-resolve'
import commonjs from 'rollup-plugin-commonjs';
import uglify from 'rollup-plugin-uglify'
export default {
entry: './src/app/app.module.aot.js',
dest: './src/dist/app.module.min.js',
sourceMap: true,
format: 'iife',
onwarn: function(warning) {
// Skip certain warnings
if ( warning.message.indexOf('\'default\' is not exported by rollup') === -1) { return; }
if ( warning.code === 'THIS_IS_UNDEFINED' ) { return; }
if ( warning.code === 'EVAL' ) { return; }
console.warn( warning.message );
},
plugins: [
nodeResolve({jsnext: true, module: true}),
commonjs({
include: [
'./node_modules/rxjs/**'
]
}),
uglify()
]
}
运行带汇总的 AOT 后一切正常,但当我尝试为我的应用程序使用延迟加载时,它不起作用。
const routes: Routes = [
{
path: "test/:id",
loadChildren: "./src/app/app.module#TestModule"
}
];
AOT 构建通过,没有任何错误,并且在使用 AOT 运行应用程序后,我在开发工具中没有看到任何错误。但延迟加载也不起作用。
UPD 在 JIT 编译中,延迟加载可以正常工作。
知道如何解决这个问题吗?
最佳答案
(只是从我的评论中回答,如果有效 - 请随意投票/接受答案)
您必须使用 webpack
进行 AOT 和延迟加载。 Rollup
将不起作用(至少目前如此)。
使用@ngtools/webpack
配置AOT+懒加载
在 webpack.config.js
const ngToolsWebpack = require('@ngtools/webpack');
var webpack = require('webpack');
module.exports = {
resolve: {
extensions: ['.ts', '.js']
},
entry: './app/main.aot.ts',
output: {
path: './dist',
publicPath: 'dist/',
filename: 'app.main.js'
},
plugins: [
new ngToolsWebpack.AotPlugin({
tsConfigPath: './tsconfig.json'
}),
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
output: {
comments: false
},
sourceMap: true
})
],
module: {
loaders: [
{ test: /\.scss$/, loaders: ['raw-loader', 'sass-loader'] },
{ test: /\.css$/, loader: 'raw-loader' },
{ test: /\.html$/, loader: 'raw-loader' },
{ test: /\.ts$/, loader: '@ngtools/webpack' }
]
},
devServer: {
historyApiFallback: true
}
};
在 tsconfig.json
{
"compilerOptions": {
"module": "es2015",
"moduleResolution": "node",
"target": "es5",
"noImplicitAny": false,
"sourceMap": true,
"mapRoot": "",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"es2015",
"dom"
],
"outDir": "lib",
"skipLibCheck": true,
"rootDir": "."
},
"angularCompilerOptions": {
"genDir": "./app/ngfactory",
"entryModule": "app/app.module#AppModule"
}
}
关于Angular 4 Ahead-of-Time - 延迟加载不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50288368/
我正在使用一个简单的脚本来延迟加载页面上的所有图像;图像源的路径包含在 data-src 属性中,然后放入 img 标记的实际 src 属性中。几乎大多数(?)延迟加载方法的实现都是如何工作的。 这是
我有一个具有多层 (SKNodes) 背景、游戏层、前景和 HUD 的场景,每个场景中都有多个 SKSpriteNode,用于滚动和您可以收集和点击的对象。 hud 层只有一个 SKSpriteNod
我有一个 Controller 函数来创建一些东西。调用该函数时,将运行 setInterval 来获取项目的状态。 这是服务: (function () { 'use strict';
在我的应用程序中,我播放音频直播,延迟非常重要。我正在使用 AVPlayer,但启动需要 5-6 秒,并且我需要最多 3 秒的延迟。我怎样才能更快地开始播放并减少延迟?设置一个小缓冲区就可以了?如何使
我有一个恼人的问题。我有这个简单的服务器代码(比方说): #!/usr/bin/env python3 import wsgiref.simple_server def my_func(env, st
我是 jquery deferreds 的新手。这里我有一个简单的example 。 谁能告诉我为什么在其他函数完成之前就触发完成函数(“现在是我的时间”)? 这里的人 example还创建一个延迟对
正在放置关闭 之前的标签标记相同的 sa 将它们放在 中部分并指定 defer="defer"属性? 最佳答案 是/否。 是的,因为放置 defer 标签会等到文档加载完毕后再执行。 否,因为放置
我知道Javascript没有delay(500)方法,它会延迟执行500毫秒,所以我一直试图通过使用setTimeout和setInterval来解决这个问题。 for(var i =0; i< 1
我们有一个读写主服务器和复制的从读服务器。在某些网络用例中,数据被发布并立即读取以发送回服务器。立即读取是在读取从属设备上完成的,由于延迟,数据尚未在那里更新。 我知道这可能是复制设置的一个常见问题,
我有以下 dag 设置以从 2015 年开始运行追赶。对于每个执行日期,任务实例在一分钟内完成。但是,第二天的任务仅在 5 分钟窗口内开始。例如。上午 10:00、上午 10:05、上午 10:10
当我在 WatchKit 中推送一个新 Controller 并在新 Controller 的awakeWithContext: 方法中使用 setTitle 时,它需要一秒钟左右来设置标题,直到
我将图像显示为 SVG 文件和文本。 出于某种原因,svg 图像的渲染速度比屏幕的其余部分慢,从而导致延迟,这对用户体验不利。 这种延迟正常吗?我该怎么做才能让整个屏幕同时呈现? Row( ma
我正在考虑在我的应用程序中使用 firebase 动态链接。我需要将唯一标识符从电子邮件生成的链接传递到用户应用程序中。当用户安装了应用程序时,这可以正常工作,但是,我对未安装应用程序的方式有些困惑。
您知道如何使用 JQuery 的延迟方法和一个函数来检测所有已更改的表单并将每个表单作为 Ajax 帖子提交吗? 如果我只列出大量表单提交,我可以得到同样的结果,但如果我使用... $('form.c
我需要一种方法来通过回调获取不同的脚本。这个方法工作正常: fetchScripts:function() { var _this=this; $.when( $.aj
我编写了一个 jquery 脚本,允许我淡入和淡出 div,然后重复。该代码运行良好。但是,当我尝试添加延迟(我希望 div 在淡出之前保持几秒钟)时,它无法正常工作。我尝试在代码中的几个地方添加延迟
我正在努力在延迟、带宽和吞吐量之间划清界限。 有人可以用简单的术语和简单的例子来解释我吗? 最佳答案 水比喻: 延迟 是穿过管子所需的时间。 带宽是管有多宽。 水流量为吞吐量 车辆类比: 从源到目的地
我有一个 CRM 系统,当添加联系人时,我想将他们添加到会计系统中。 我在 CRM 系统中设置了一个 Webhook,将联系人传递给 Azure 函数。 Azure 函数连接到会计系统 API 并在那
我有一个 Android AudioTrack,例如: private AudioTrack mAudioTrack; int min = AudioTrack.getMinBufferSize(sa
我正在 React 中开发一个 TODO 应用程序,并尝试构建将删除选中项目延迟 X 秒的功能,并且如果在这段时间内未选中该框,它将不会被删除。 我遇到的主要问题是当用户在同一 X 秒内检查、取消检查
我是一名优秀的程序员,十分优秀!