krmanik/genanki-js

Folders and files

Name		Name	Last commit message	Last commit date
Latest commit History 57 Commits
.github/workflows		.github/workflows
dist		dist
docs		docs
genanki		genanki
sample		sample
License.md		License.md
README.md		README.md
gulpfile.js		gulpfile.js
package.json		package.json
release.md		release.md

Repository files navigation

genanki-js

A JavaScript implementation for generating Anki decks in browser. This is fork of mkanki.

QuickStart

Download genanki zip file from release pages.

The zip file contains two folder

dist : This folder contains genanki.js file. If project already configured with sql.js, FileSaver.js and JSZip then just add genanki.js file to project.
sample : This folder contains latest sql.js, FileSaver.js, JSZip and genanki.js. It is ready to use folder.

Alternatively, genanki.js can also be loaded from CDN.

<script src="https://cdn.jsdelivr.net/gh/krmanik/genanki-js/dist/genanki.js"></script>

Documentation

View Documentation

CSV/TSV to Anki Package

Visit page and select CSV to APKG from top menu.
CSV to APKG

Set Up a new project from scratch

Download genanki.js from dist folder and add to the project

<!-- for creating and exporting anki package file -->
<script src='genanki.js'></script>

Add sql.js, FileSaver.js and JSZip to the project

Note: mkanki uses better-sql, fs and archiver, that make it difficult to be used in browser

<!-- sqlite -->
<script src='js/sql/sql.js'></script>
<!-- File saver -->
<script src="js/filesaver/FileSaver.min.js"></script>
<!-- jszip for .apkg -->
<script src="js/jszip.min.js"></script>

Create a SQL global variable (may be added to index.js)

// The `initSqlJs` function is globally provided by all of the main dist files if loaded in the browser.
// We must specify this locateFile function if we are loading a wasm file from anywhere other than the current html page's folder.
config = {
 locateFile: filename => `js/sql/sql-wasm.wasm`
}
var SQL;
initSqlJs(config).then(function (sql) {
 //Create the database
 SQL = sql;
});

Now use following Examples to generate and export decks.

View more examples here Examples

Examples

var m = new Model({
 name: "Basic (and reversed card)",
 id: "1543634829843",
 flds: [
 { name: "Front" },
 { name: "Back" }
 ],
 req: [
 [ 0, "all", [ 0 ] ],
 [ 1, "all", [ 1 ] ]
 ],
 tmpls: [
 {
 name: "Card 1",
 qfmt: "{{Front}}",
 afmt: "{{FrontSide}}\n\n<hr id=answer>\n\n{{Back}}",
 },
 {
 name: "Card 2",
 qfmt: "{{Back}}",
 afmt: "{{FrontSide}}\n\n<hr id=answer>\n\n{{Front}}",
 }
 ],
})
 
var d = new Deck(1276438724672, "Test Deck")
d.addNote(m.note(['this is front', 'this is back']))
var p = new Package()
p.addDeck(d)
p.writeToFile('deck.apkg')