我有一个大型webpack构建,在"额外的资产处理"步骤中几乎挂起91%,这不会给我更多的信息.这个步骤消耗长达4分钟,并且在我们向构建中添加模块时似乎几乎呈指数级增长.有没有办法更好地了解在此步骤中完成的工作并最终优化它?
56205ms building modules
31ms sealing
0ms optimizing
0ms basic module optimization
15ms module optimization
0ms advanced module optimization
0ms basic chunk optimization
0ms chunk optimization
16ms advanced chunk optimization
14487ms building modules
0ms module and chunk tree optimization
31ms module reviving
0ms module order optimization
16ms module id optimization
0ms chunk reviving
16ms chunk order optimization
31ms chunk id optimization
140ms hashing
0ms module assets processing
265ms chunk assets processing
0ms additional chunk assets processing
0ms recording
206740ms additional …Run Code Online (Sandbox Code Playgroud) 我喜欢使用importwebpack 3 中的命令动态导入块的能力。不幸的是,它似乎只能在资源位于服务器上相当静态的目录配置中时才能使用。
在我的环境中,html 页面在后端动态生成(假设http:/localhost/app)。所有其他资源(js、css、图像等)都在不同的目录中(比如http:/localhost/res),但另外res不是静态的,而是可以在后端动态更改。
只要我不使用任何动态导入,一切都会按预期工作,但是当尝试动态加载任何块时,这会失败,因为默认情况下 webpack 期望块在其中,http:/localhost/app而我无法使用,publicPath因为资源所在的 url 是动态的。
有没有办法(运行时)配置 webpack 以加载相对于当前资源所在路径的资源。例如,如果page1.js位于 中的块http:/localhost/resA动态加载块,sub1.js他应该在http:/localhost/resA而不是 中查找它http:/localhost/app。
生成的 html 将在以下位置可用http:/localhost/app/page1:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script src="http:/localhost/resA/page1.bundle.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
文件src/page1.js将可用为http:/localhost/resA/page1.bundle.js:
import(/* webpackChunkName: "sub1" */ './sub1').then(({MyClass}) => {/*...*/});
Run Code Online (Sandbox Code Playgroud)
文件src/sub1将可用为http:/localhost/resA/sub1.bundle.js:
export class MyClass {};
Run Code Online (Sandbox Code Playgroud)
文件`webpack.config.js':
const path = require('path'); …Run Code Online (Sandbox Code Playgroud) 如何从Selenium Webdriver内部启用chromedriver详细日志记录功能?
我找到了适当的方法loggingTo,enableVerboseLogging但似乎无法正确地使用它们:
require('chromedriver');
const webdriver = require('selenium-webdriver');
let capabilities = webdriver.Capabilities.chrome();
capabilities.setScrollBehavior(1);
let builder = new webdriver.Builder().withCapabilities(capabilities);
builder.enableVerboseLogging(); // fails!!!
let driver = builder.build();
Run Code Online (Sandbox Code Playgroud) javascript selenium selenium-chromedriver selenium-webdriver
如何独立于模块本身导出和导入类型定义。
在 flowtype 中,这看起来像这样:文件使用sub.js导出类型,文件使用使用导入类型myTypeexport type myType = {id: number};main.jsimport type {myType} from './sub.js';
我已将 TypeScript 的问题简化为以下示例。尝试运行 tsc 时,我收到以下错误消息,但tslib应该可用。
https://codesandbox.io/s/quizzical-mclean-n9vvi?fontsize=14&hidenavigation=1&theme=dark
$ tsc --noEmit --project ./tsconfig.json
index.js:3:8 - error TS2354: This syntax requires an imported helper but module 'tslib' cannot be found.
3 const {ArgumentParser} = require('argparse');
~~~~~~~~~~~~~~
Found 1 error.
Run Code Online (Sandbox Code Playgroud)
包.json
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.ts",
"scripts": {
"test": "tsc --noEmit --project ./tsconfig.json"
},
"author": "",
"license": "ISC",
"devDependencies": {
"@types/argparse": "1.0.38",
"argparse": "1.0.10",
"tslib": "1.11.1",
"typescript": "3.8.3"
}
}
Run Code Online (Sandbox Code Playgroud)
tsconfig.json
{
"compilerOptions": {
"checkJs": true,
"allowJs": true, …Run Code Online (Sandbox Code Playgroud) 是否可以在 M1 Mac 上使用 Xcode 构建本机 Intel 二进制文件?我想开始使用 M1 架构进行测试,但仍需要继续构建原生英特尔应用程序,而无需进行任何更改。
有没有办法强制浏览器在 JavaScript 执行期间呈现 DOM 更改?在下面的例子中,只会显示“1000”,我知道这是因为只有一个线程处理 JavaScript 执行,但我想知道是否有办法强制浏览器呈现每个 DOM 更改?
例子:
var el = document.getElementById("#fixup"),
i;
for (i = 1; i <= 1000; i++) {
// can i force this DOM update to the rendered?
el.innerHTML = i.toString());
}
Run Code Online (Sandbox Code Playgroud) 当尝试使用流类型注释处理js源时,jsdoc解析器很难理解增强的语法!有没有办法在使用流类型注释增强的js源中使用jsdoc,或者从类型带注释的js生成文档的推荐方法是什么?
我目前正在评估TypeScript,尝试导入jQuery时遇到一些问题。
import * as $ from 'jquery';
const $el = $('#app');
Run Code Online (Sandbox Code Playgroud)
报告以下错误:
src/log.ts:2:13 - error TS2349: Cannot invoke an expression whose type lacks a call signature. Type '{ default: JQueryStatic; ajaxSettings: AjaxSettings<any>; A
nimation: AnimationStatic; Callbacks: CallbacksStatic; cssHooks: CSSHooks; cssNumber: PlainObject<boolean>; Deferred: DeferredStatic; ... 62 more ...; when<TR1,
UR1, VR1, TJ1 = any, UJ1 = any, VJ1 = any>(deferredT: TR1 | ... 1 more ... | Thenable<...>, defer...' has no compatible call signatures.
2 const $el = $('#app');
~~~~~~~~~
src/log.ts:1:1 …Run Code Online (Sandbox Code Playgroud) 以下 TypeScript 示例代码显示了严格模式下Element implicitly has an 'any' type because type '{one: number; two: number;}' has no index signature该行const one = obj[prop];中的错误。
编译器允许 line const two = obj[propName];,所以我不明白为什么会显示错误或者一般来说如何使用括号表示法访问对象的属性。
const obj = { one: 1, two: 2 };
const props = { one: 'one', two: 'two' };
// it is not possible add or change any properties in the props object
props.zero = 'zero';
props.one = 1;
// prop has the type string
const prop = props.one; …Run Code Online (Sandbox Code Playgroud)