Skip to content

Commit

Permalink
Fmt
Browse files Browse the repository at this point in the history
  • Loading branch information
LorisSigrist committed Oct 3, 2023
1 parent 3bab9e2 commit 4e4283c
Show file tree
Hide file tree
Showing 5 changed files with 59 additions and 45 deletions.
54 changes: 30 additions & 24 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,46 +3,53 @@
Typesafe i18n.

## Installation

```
pnpm i -D t18s
```

## Usage

`t18s` is a vite plugin that compiles your translations to a typesafe format. It also dynamically generates the runtime code to work with your translations.

1. Add the plugin to your vite config

```js
// vite.config.js
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import { t18s } from "t18s"
import { sveltekit } from "@sveltejs/kit/vite";
import { defineConfig } from "vite";
import { t18s } from "t18s";

export default defineConfig({
//Plugin order doesn't matter
//Default options are shown
plugins: [sveltekit(), t18s({
translationsDir: "src/translations",
dts: "src/t18s.d.ts"
})]
//Plugin order doesn't matter
//Default options are shown
plugins: [
sveltekit(),
t18s({
translationsDir: "src/translations",
dts: "src/t18s.d.ts",
}),
],
});
```

Then start the dev server with `(p)npm dev`.

2. Create a translations file
In the `translationsDir` that you specified in the vite config, create a file called `en.json` (or whatever locale you want to use). The file should contain key-value pairs of translations.
In the `translationsDir` that you specified in the vite config, create a file called `en.json` (or whatever locale you want to use). The file should contain key-value pairs of translations.

```json
{
"hello": "Hello World!",
"helloName": "Hello {name}!"
"hello": "Hello World!",
"helloName": "Hello {name}!"
}
```

The values must be valid ICU MessageFormat strings.
You can also use YAML files.

3. Use the translations in your code

```svelte
<script>
import { t } from "$t18s" //The $t18s module is dynamically generated by the plugin
Expand Down Expand Up @@ -71,18 +78,17 @@ That's it.
- [ ] Locale extraction helpers
- [ ] Documentation Site
- [ ] All Common Message-File Formats
- [x] JSON
- [x] YAML
- [ ] TOML
- [ ] CSV
- [ ] XLIFF
- [ ] PO
- [ ] INI
- [ ] XML
- [x] JSON
- [x] YAML
- [ ] TOML
- [ ] CSV
- [ ] XLIFF
- [ ] PO
- [ ] INI
- [ ] XML
- [ ] Edit translations inline in the browser (like [Better i18n for Svelte](https://github.com/versiobit/better-i18n-for-svelte))
- [ ] Frameworks other than Svelte
- [ ] Vanilla
- [ ] React
- [ ] Vue
- [ ] Vanilla
- [ ] React
- [ ] Vue
- [ ] Message Description Intellisense

5 changes: 4 additions & 1 deletion src/adapter/svelte/store.js
Original file line number Diff line number Diff line change
Expand Up @@ -202,7 +202,10 @@ export const setLocale = locale.set;
export const isLoading = writable(false);
const loaders = {
${locales.map((locale) => ` "${locale}": async () => (await import("$t18s/messages/${locale}")).default`)}
${locales.map(
(locale) =>
` "${locale}": async () => (await import("$t18s/messages/${locale}")).default`,
)}
}
Expand Down
4 changes: 3 additions & 1 deletion src/file-handling/fileHandler.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,9 @@ export class FileHandler {
async handle(filePath, locale) {
const handler = this.#getHandler(filePath);
if (!handler)
throw new LoadingException(`Could not find handler for ${filePath}. Supported file extensions are ${this.getSupportedFileExtensions()}`);
throw new LoadingException(
`Could not find handler for ${filePath}. Supported file extensions are ${this.getSupportedFileExtensions()}`,
);
const textContent = await this.#readFileContent(filePath);
const dictionary = await handler.load(filePath, textContent, locale);

Expand Down
6 changes: 3 additions & 3 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,7 @@ export function t18s(userConfig = {}) {
dtsPath: resolve(resolvedConfig.root, fullUserConfig.dts),
translationsDir: resolve(
resolvedConfig.root,
fullUserConfig.translationsDir
fullUserConfig.translationsDir,
),
fallbackLocale: "en",
};
Expand All @@ -151,7 +151,7 @@ export function t18s(userConfig = {}) {
if (id.startsWith(VIRTUAL_MODULE_PREFIX)) {
return id.replace(
VIRTUAL_MODULE_PREFIX,
RESOLVED_VIRTUAL_MODULE_PREFIX
RESOLVED_VIRTUAL_MODULE_PREFIX,
);
}
},
Expand All @@ -167,7 +167,7 @@ export function t18s(userConfig = {}) {
const locale = id.split("/")[2];
if (!locale) return;
return adapter.getDictionaryCode(
localeDictionaries.get(locale) || new Map()
localeDictionaries.get(locale) || new Map(),
);
},

Expand Down
35 changes: 19 additions & 16 deletions test/compiler/file-handling/fileHandler.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,26 @@ import { FileHandler } from "../../../src/file-handling/fileHandler.js";
import { LoadingException } from "../../../src/file-handling/exception.js";

describe("FileHandler", () => {
describe("handle", () => {
it("throws LoadingException if no handler is found", async () => {
const handler = new FileHandler([]);
await expect(handler.handle("foo.bar", "en")).rejects.toThrow(
LoadingException,
);
});

describe("handle", () => {
it("throws LoadingException if no handler is found", async () => {
const handler = new FileHandler([]);
await expect(handler.handle("foo.bar", "en")).rejects.toThrow(LoadingException);
});

it("throws LoadingException if the file cannot be read", async () => {
const handler = new FileHandler([
{
fileExtensions: ["json"],
load: async () => new Map(),
},
]);
await expect(handler.handle("nonexistent.json", "en")).rejects.toThrow(LoadingException);
});
it("throws LoadingException if the file cannot be read", async () => {
const handler = new FileHandler([
{
fileExtensions: ["json"],
load: async () => new Map(),
},
]);
await expect(handler.handle("nonexistent.json", "en")).rejects.toThrow(
LoadingException,
);
});
});

describe("getSupportedFileExtensions", () => {
it("correctly reports which file extensions it supports, if none are", () => {
Expand Down Expand Up @@ -49,7 +52,7 @@ describe("FileHandler", () => {
},
]);
expect(handler.getSupportedFileExtensions()).toEqual(
new Set(["json", "yaml", "yml"])
new Set(["json", "yaml", "yml"]),
);
});
});
Expand Down

0 comments on commit 4e4283c

Please sign in to comment.