A simple web SVG editor(work in process).
Built by React + Typescript
Try the editor: https://blog.fstars.wang/app/svg-editor/
yarn
yarn dev
There is not electron dependency in package.json
, because electron Installation is too big and someone maybe want not to build electron app. So you have to install it manually:
npm install -g electron
If you are in China, maybe you should set npm config before install electron:
npm config set registry https://registry.npm.taobao.org/
npm config set ELECTRON_MIRROR http://npm.taobao.org/mirrors/electron/
build, then view or package:
# electron will use /dist/index as entry, so you have to build while you changed code.
npm run build
# view the result of electron
npm run electron
# or package electron app according to your OS
npm run electron:package
Editor
Setting
ToolManager(add rect, select...)
CommandManager
ActivedElsManager
Shortcut
Viewport(scroll, zoom)
...
FSVG
event summary(bind listener):
- Zoom change
- Redo/undo stack is empty
- Fill/stroke/strokeWidth change
- Switch tool