LoginSignup
15
16

More than 5 years have passed since last update.

Electron + CoffeeScript

Last updated at Posted at 2015-05-17

CoffeeScript を使って Electron アプリケーションを書く方法を試してみました。reactjs - electronでbabel + reactを直接使えるようにするまで - Qiita を参考にしました。

たぶん、TypeScript なんかも同じように typescript-register とか使えばいけると思います。

ポイント

  • メインプロセスではまだ CoffeeScript 化は成功していない
  • レンダリングプロセスで coffee-script/register を require する

ソース

  • package.json
{
  "name": "testelectron",
  "main": "app.js",
  "scripts": {
    "run": "./node_modules/.bin/electron app.js"
  },
  "dependencies": {
    "coffee-script": "^1.9.2",
    "electron-prebuilt": "^0.26.0"
  }
}
  • app.js
var app = require('app');
var BrowserWindow = require('browser-window');
var mainWindow = null;

app.on('window-all-closed', function() {
    app.quit();
});

app.on('ready', function() {
  mainWindow = new BrowserWindow({width: 800, height: 600});
  mainWindow.loadUrl('file://' + __dirname + '/index.html');
  mainWindow.on('closed', function() {
    mainWindow = null;
  });
});
  • index.html
<!DOCTYPE html>
<html lang="ja">
  <title>greetings</title>
  <div id="greetings"></div>
  <script>
    require('coffee-script/register');
    require('./renderer.coffee')
  </script>
</html>
  • renderer.coffee
greetings = document.getElementById 'greetings'
greetings.innerHTML = "hello, world."

実行

$ npm install
$ ./node_modules/.bin/electron app.js
15
16
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
15
16