Drizzle <> OP SQLite

根据官方 GitHub 页面，OP-SQLite 嵌入了最新版本的 SQLite，并提供了执行 SQL 查询的底层 API。

npm

yarn

pnpm

bun

npm i drizzle-orm @op-engineering/op-sqlite -D drizzle-kit

yarn add drizzle-orm @op-engineering/op-sqlite -D drizzle-kit

pnpm add drizzle-orm @op-engineering/op-sqlite -D drizzle-kit

bun add drizzle-orm @op-engineering/op-sqlite -D drizzle-kit

import { drizzle } from "drizzle-orm/op-sqlite";
import { open } from '@op-engineering/op-sqlite';

const opsqlite = open({
  name: 'myDB',
});
const db = drizzle(opsqlite);

await db.select().from(users);

你可以使用 Drizzle Kit 进行 SQL 迁移生成。在继续操作之前，请务必检查 Drizzle Kit 迁移的工作原理。OP SQLite 要求你将 SQL 迁移打包到应用中，我们已经为你做好了准备。

安装 babel 插件

需要将 SQL 迁移文件以字符串形式直接打包到包中。

npm install babel-plugin-inline-import

更新配置文件。

你需要更新 babel.config.js、metro.config.js 和 drizzle.config.ts 文件

module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: [
    [
      'inline-import',
      {
        extensions: ['.sql'],
      },
    ],
  ],
};

const { getDefaultConfig } = require('@react-native/metro-config');

const config = getDefaultConfig(__dirname);

config.resolver.sourceExts.push('sql');

module.exports = config;

请确保 Drizzle Kit 配置中包含 dialect: 'sqlite' 和 driver: 'expo'。

import type { Config } from 'drizzle-kit';

export default {
	schema: './db/schema.ts',
	out: './drizzle',
  dialect: 'sqlite',
	driver: 'expo', // <--- very important
} satisfies Config;

生成迁移

创建 SQL 模式文件和 drizzle.config.ts 文件后，你可以生成迁移。

npx drizzle-kit generate

为你的应用添加迁移

现在你需要将 migrations.js 文件从 ./drizzle 文件夹导入到你的 Expo/React Native 应用中。你可以在应用启动时根据需要手动使用我们自定义的 useMigrations 迁移钩子在 useEffect 钩子上执行迁移。

import { drizzle } from "drizzle-orm/op-sqlite";
import { open } from '@op-engineering/op-sqlite';
import { useMigrations } from 'drizzle-orm/op-sqlite/migrator';
import migrations from './drizzle/migrations';

const opsqliteDb = open({
  name: 'myDB',
});

const db = drizzle(opsqliteDb);

export default function App() {
  const { success, error } = useMigrations(db, migrations);

  if (error) {
    return (
      <View>
        <Text>Migration error: {error.message}</Text>
      </View>
    );
  }

  if (!success) {
    return (
      <View>
        <Text>Migration is in progress...</Text>
      </View>
    );
  }

  return ...your application component;
}