Drizzle <> Expo SQLite

根据 官方网站,Expo 是一个用于在 React Native 上开发、构建和发布应用的工具生态系统。它由 Hermes JavaScript 运行时和 Metro 打包器提供支持,Drizzle Expo 驱动程序原生支持这两种功能。

Drizzle ORM 拥有同类最佳的 Expo SQLite 工具包:

npm
yarn
pnpm
bun
npm i drizzle-orm expo-sqlite@next -D drizzle-kit
import { drizzle } from "drizzle-orm/expo-sqlite";
import { openDatabaseSync } from "expo-sqlite";

const expo = openDatabaseSync("db.db");
const db = drizzle(expo);

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

实时查询

使用 useLiveQuery 钩子,你可以使任何 Drizzle 查询具有响应性:

import { useLiveQuery, drizzle } from 'drizzle-orm/expo-sqlite';
import { openDatabaseSync } from 'expo-sqlite';
import { Text } from 'react-native';
import * as schema from './schema';

const expo = openDatabaseSync('db.db', { enableChangeListener: true }); // <-- enable change listeners
const db = drizzle(expo);

const App = () => {
  // Re-renders automatically when data changes
  const { data } = useLiveQuery(db.select().from(schema.users));
  return <Text>{JSON.stringify(data)}</Text>;
};

export default App;

使用 Drizzle Kit 进行 Expo SQLite 迁移

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

安装 babel 插件

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

npm install babel-plugin-inline-import

更新配置文件。

你需要更新 babel.config.jsmetro.config.jsdrizzle.config.ts 文件

babel.config.js
module.exports = function(api) {
  api.cache(true);

  return {
    presets: ['babel-preset-expo'],
    plugins: [["inline-import", { "extensions": [".sql"] }]] // <-- add this
  };
};
metro.config.js
const { getDefaultConfig } = require('expo/metro-config');

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname);

config.resolver.sourceExts.push('sql'); // <--- add this

module.exports = config;

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

drizzle.config.ts
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 钩子上执行迁移。

App.tsx
import { drizzle } from "drizzle-orm/expo-sqlite";
import { openDatabaseSync } from "expo-sqlite";
import { useMigrations } from 'drizzle-orm/expo-sqlite/migrator';
import migrations from './drizzle/migrations';

const expoDb = openDatabaseSync("db.db");

const db = drizzle(expoDb);

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;
}