小编The*_*yne的帖子

Webpack 5 供应商块命名

在 webpack 4 中,供应商块具有诸如 之类的名称vendors~main~secondary.js,这些名称指的是与其相关的块。现在,在 webpack 5 中,供应商块名称是这样的 : vendors-node_modules_react-dom_index_js.js,这确实不太可读和理解。

关于如何在使用 webpack 5 时恢复到 webpack 4 的行为有什么建议吗?

我想我必须做点什么splitChunks.name,但我找不到合适的函数来做到这一点。

编辑

虽然 @MrP01 的答案更彻底,并且对使用提供了更多见解splitChunks.name,但这里有一个我最终使用的简短片段,它允许我回到确切的旧行为。

optimization: {
  splitChunks: {
    chunks: 'all',
    name: (module, chunks, cacheGroupKey) => {
      const allChunksNames = chunks.map((chunk) => chunk.name).join('~');
      const prefix = cacheGroupKey === 'defaultVendors' ? 'vendors' : cacheGroupKey;
      return `${prefix}~${allChunksNames}`;
    },
  },
},
Run Code Online (Sandbox Code Playgroud)

webpack webpack-splitchunks

12
推荐指数
1
解决办法
8852
查看次数

防止在 iOS 13 / Mobile Safari 上点击并按住时选择文本

点击并按住 DIV 会导致 Safari 选择(即突出显示)周围的文本并使手机振动,即使该 DIV 的属性设置user-selectnone。这在我的应用程序上下文中非常烦人。它似乎是 iOS 13 及其 Haptic Touch 特有的。

我尝试e.preventDefault()在该touchstart事件中进行操作并且它有效,但同时禁用了滚动功能。

我也尝试按照Apple 文档中的建议e.preventDefault()参与该活动,但这根本不起作用。webkitmouseforcewillbegin

有人知道如何解决这个问题吗?

视频: https: //youtu.be/SstDm0M8RN0

javascript safari ios13

6
推荐指数
1
解决办法
5868
查看次数

如何在 html 画布上使文本适合精确的宽度?

如何在 html5 画布上将单行文本字符串调整为精确的宽度?到目前为止,我尝试的是以初始字体大小编写文本,使用 测量文本的宽度measureText(my_text).width,然后根据所需的文本宽度与实际文本宽度之间的比率计算新的字体大小。它给出的结果大致正确,但根据文本的不同,边缘处会有一些空白。

这是一些示例代码:

// Draw "guard rails" with 200px space in between
c.fillStyle = "lightgrey";
c.fillRect(90, 0, 10, 200);
c.fillRect(300, 0, 10, 200);

// Measure how wide the text would be with 100px font
var my_text = "AA";
var initial_font_size = 100;
c.font = initial_font_size + "px Arial";
var initial_text_width = c.measureText(my_text).width;

// Calculate the font size to exactly fit the desired width of 200px
var desired_text_width = 200; 
new_font_size = initial_font_size * desired_text_width / initial_text_width; …
Run Code Online (Sandbox Code Playgroud)

html text measurement html5-canvas

2
推荐指数
1
解决办法
4962
查看次数