如何在没有 Visual studio 和 GTK 的情况下在 windows 上使用 konva
How to use konva on windows without Visual studio and GTK
好像只需要VS和GTK来搭建node-canvas,这是konva需要的。
请原谅我,因为我是一个完全的新手,但是有没有其他方法可以做到这一点而不必下载和安装一堆我永远不会用于其他任何事情的大东西?整个过程对我来说似乎很愚蠢,因为现在大多数浏览器本身都支持 HTML5 canvas。
您可以在 NodeJS 环境中使用 Konva
。对于这种情况,node-canvas
是必需的。所以你必须为 in.
安装所有依赖项
可能您不需要 NodeJS。您可以使用浏览器环境。对于这种情况,不需要 node-canvas
。 DEMO
我找到了答案,很简单,我错过了整整一个星期!
只做一个npm install konva react-konva --save-dev
,不用安装node-canvas
。
在我像这样在组件文件的开头导入 konva 之前
import {Layer, Rect, Stage, Group} from 'react-konva';
但是这是在创建 DOM 之前加载的,所以 webpack 无法解析 'canvas',这导致
Could not resolve module 'canvas'
异常。
我通过将其向下移动到 componentDidMount 或 render 方法使其工作:
render() {
const {Layer, Rect, Stage, Group} = require('react-konva');
return (
<div ref="containerDOM">
<Stage width={700} height={700}>
<Layer>
<Rect
width="50"
height="50"
fill="green"
/>
</Layer>
</Stage>
</div>
);
}
好像只需要VS和GTK来搭建node-canvas,这是konva需要的。
请原谅我,因为我是一个完全的新手,但是有没有其他方法可以做到这一点而不必下载和安装一堆我永远不会用于其他任何事情的大东西?整个过程对我来说似乎很愚蠢,因为现在大多数浏览器本身都支持 HTML5 canvas。
您可以在 NodeJS 环境中使用 Konva
。对于这种情况,node-canvas
是必需的。所以你必须为 in.
可能您不需要 NodeJS。您可以使用浏览器环境。对于这种情况,不需要 node-canvas
。 DEMO
我找到了答案,很简单,我错过了整整一个星期!
只做一个npm install konva react-konva --save-dev
,不用安装node-canvas
。
在我像这样在组件文件的开头导入 konva 之前
import {Layer, Rect, Stage, Group} from 'react-konva';
但是这是在创建 DOM 之前加载的,所以 webpack 无法解析 'canvas',这导致
Could not resolve module 'canvas'
异常。
我通过将其向下移动到 componentDidMount 或 render 方法使其工作:
render() {
const {Layer, Rect, Stage, Group} = require('react-konva');
return (
<div ref="containerDOM">
<Stage width={700} height={700}>
<Layer>
<Rect
width="50"
height="50"
fill="green"
/>
</Layer>
</Stage>
</div>
);
}