小编Spe*_*und的帖子

我在这个codepen 中有我的示例设置。我试图在网格中打印动态数量的图像，以使每页底部的内容不会被切断。使用page-break-before似乎是最简单的做事方式。

所以每 5 列我插入一个中断项

<div class="page-break"></div>

和以下css

@media all {
  .page-break { display: none; }
}

@media print {
  .page-break { display: block; page-break-before: always; }
}

但这似乎没有效果。我找不到任何明确说明它的地方，但由于此属性不适用于浮动元素，因此我假设它也不适用于 flexbox。

我还能如何实现我正在寻找的：能够从未知数量的项目中动态创建一个 5 列宽的网格，这将与分页属性一起使用。

我一直在将一个项目从 Webpack 4 迁移到 5 并且遇到了障碍。该--watch选项不再适用于我的配置，我已经尝试了所有我能找到的方法。

const webpack = require('webpack');
const path = require('path');

const PATHS = {
  build: path.join(__dirname, "dist")
}

const baseConfig = {
  entry: {
    main: './js/router.js',
  },
  output: {
    path: PATHS.build,
    filename: `[name].[chunkhash].js`,
    chunkFilename:`[name].[chunkhash].js`,
    publicPath: '/dist'
  }
  //loaders and stuff
}

module.exports = baseConfig;

webpack --watch --progress --mode development

这就是配置可以归结为导致问题的原因。Webpack 最初构建得很好，我可以在本地查看页面。

但是对入口点或其导入的任何模块的任何进一步更改都不会重新编译。我在启动命令中添加的进度选项没有效果。

我怀疑问题出在 WSL 上。当我升级到 webpack 5 时，我遇到了这个问题 出于某种原因，webpack 5 会尝试扫描系统文件，如果它位于/mnt/c并获取锁定错误。我最终确定了这个答案并将我的项目所在的位置从/mnt/c/dev到/usr/local/dev. 这解决了锁定问题，我现在在这里。

我也尝试添加到我的 webpack 配置中： …

抓我的头试图让这个最佳.假设我有一个函数将对象作为参数并像这样破坏它:

myfunc = (options = {a:true, b:true, c:true}) => {...}

默认情况下,ab和c为true.但是说我打电话,myfunc并希望b是假的:

myfunc({b:false})

现在好了options.b === false,但a和c的值都消失了.有没有我可以完成这个而不必传递默认值的副本？

我尝试了一些奇怪的东西

myfunc = (options = Object.assign({a:true, b:true, c:true}, options)) =>{}

但那当然不对.

我正在尝试使用节点中的 fabric.js 从本地文件夹加载图像。关于如何执行此操作的最新文档似乎很少。大多数示例使用fabric.Image.fromURL(imageurl)

据我所知，这只适用于网址，不适用于本地路径。如果我错了，请纠正我，但我已经尝试过了

fabric.Image.fromURL(imgpath, (img) => {
    ...
}

抛出错误 Coul not load img: /image/path/img.jpg

在哪里

fs.readFile(imagepath, (err, i) => {
   ...
})

将成功读取文件，i将是一个缓冲区。

加载本地图像的正确方法是什么。我知道有一个，fabric.Image.fromObject但我不知道它想要什么类型的对象。

我目前加载图像成2D Canvas对象，以将其转换canvas.toDataURL()并把该URL到fabric.Image.fromURL()其工作，但将图像转换到一个URL是非常缓慢的，由于大的图像。一定有办法直接加载图片，避免这个问题。