开源项目 Notable 使用教程

开源项目 Notable 使用教程

notableAn alternative note-taking app designed specifically for BOOX e-ink devices项目地址:https://gitcode.com/gh_mirrors/notab/notable

1. 项目的目录结构及介绍

Notable 项目的目录结构如下：

notable/
├── assets/
│   ├── icons/
│   ├── logo.png
├── build/
├── docs/
├── electron/
├── resources/
├── scripts/
├── src/
│   ├── common/
│   ├── components/
│   ├── editor/
│   ├── main/
│   ├── renderer/
│   ├── store/
│   ├── styles/
│   ├── utils/
├── static/
├── test/
├── .babelrc
├── .editorconfig
├── .eslintignore
├── .eslintrc.js
├── .gitignore
├── .travis.yml
├── app-update.yml
├── index.js
├── package.json
├── README.md
├── tsconfig.json
├── tslint.json

目录结构介绍

• assets/: 存放项目资源文件，如图标和logo。
• build/: 存放构建生成的文件。
• docs/: 存放项目文档。
• electron/: 与 Electron 相关的文件。
• resources/: 存放项目资源。
• scripts/: 存放脚本文件。
• src/: 项目源代码目录。
  • common/: 公共模块。
  • components/: 组件模块。
  • editor/: 编辑器模块。
  • main/: 主进程模块。
  • renderer/: 渲染进程模块。
  • store/: 状态管理模块。
  • styles/: 样式文件。
  • utils/: 工具模块。
• static/: 静态文件。
• test/: 测试文件。
• 配置文件和项目描述文件。

2. 项目的启动文件介绍

Notable 项目的启动文件是 index.js。这个文件是 Electron 应用的入口点，负责启动主进程。

index.js 文件内容概述

const { app, BrowserWindow } = require('electron');
const path = require('path');
const url = require('url');

let mainWindow;

function createWindow() {
  mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
    },
  });

  mainWindow.loadURL(
    process.env.ELECTRON_START_URL ||
      url.format({
        pathname: path.join(__dirname, '/../build/index.html'),
        protocol: 'file:',
        slashes: true,
      })
  );

  mainWindow.on('closed', () => {
    mainWindow = null;
  });
}

app.on('ready', createWindow);

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

app.on('activate', () => {
  if (mainWindow === null) {
    createWindow();
  }
});

启动文件功能

• 创建主窗口。
• 加载应用的 HTML 文件。
• 处理窗口的生命周期事件。

3. 项目的配置文件介绍

Notable 项目的主要配置文件是 package.json。这个文件包含了项目的元数据和依赖项。

package.json 文件内容概述

{
  "name": "notable",
  "version": "1.0.0",
  "description": "The Markdown-based note-taking app that doesn't suck.",
  "main": "index.js",
  "scripts": {
    "start": "electron .",
    "build": "electron-builder"
  },
  "dependencies": {
    "electron": "^12.0.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "electron-builder": "^22.10.5"
  }
}

配置文件功能

• 定义项目名称、版本和描述。
• 指定主入口文件。

notableAn alternative note-taking app designed specifically for BOOX e-ink devices项目地址:https://gitcode.com/gh_mirrors/notab/notable