1. eielh

    No comment

    eielh
Changes in body
Source | HTML | Preview
@@ -1,123 +1,126 @@
GASを書くのにflowを使いたかったので rollupとbabelつかってみています。(実験的)
主要な設定をメモしときます。
細かいことは他の良質な記事を参照ください。
以下のコマンドでGASのコードを更新できるようにしてます。
```
yarn deploy
```
# 必要な気がするコマンドのインストール
```
npm install -g yarn rollup gapps
```
デフォルトは src だけど srcは普段書きたいコードを起きたいので、gaaps.config.jsonのpathを変更してます。fileIdは各々違います。
```gapps.config.json
{
"path": "dist",
"fileId": "xxxxxxxxxxxxx"
}
```
+# 設定
+
デプロイスクリプトの設定
```package.json
{
"scripts": {
"upload": "gapps upload",
"build": "rollup -c",
"deploy": "yarn build && yarn upload"
}
}
```
babelってnpmをまとめて一つのファイルにするのにrollupしてみています。
rollup-plugin-gasの説明全然かいてなかったので適当につかっています。
```rollup.config.js
import babel from 'rollup-plugin-babel'
import gas from 'rollup-plugin-gas'
import nodeResolve from 'rollup-plugin-node-resolve'
export default {
input: 'src/index.js',
output: {
file: "dist/index.js",
format: 'es',
},
plugins: [
nodeResolve({ jsnext: true }), // node_modulesにあるのもくっつけてくれる
babel({
exclude: 'node_modules/**'
}),
gas(),
],
}
```
flowの設定はお好みで。
`modules: false`はいれておかないとbabelがimportを処理してしまう。
```.babelrc
{
"presets": [
"flow",
[
"env",
{
"modules": false
}
]
]
}
```
使うモジュールのインストール
```
yarn add -D babel-core babel-preset-env babel-preset-flow rollup-plugin-babel rollup-plugin-gas rollup-plugin-node-resolve
```
-サンプルコード
+# サンプルコード
```src/index.js
global.helloWorld = () => {
Logger.log("Hello, World")
};
```
# ビルド
ビルドすると`dist/index.js`が生成されます。
こんな感じ
```
var global=this;function helloWorld() {
}
global.helloWorld = function () {
Logger.log(result);
};
```
importもつかえますが、使えるモジュールは限られるかなと思います。
確認用にis-gasってパッケージを作って公開してみてます。
* [npm is-gas](https://www.npmjs.com/package/is-gas)
# TODO
+* 一から確認してない。次のプロジェクト作る時に確認する
* flow用の型定義がみつけられてないので、なかったらかくかもしれない。
# 参考文献
* https://rollupjs.org/
* https://www.npmjs.com/package/gas-entry-generator
* http://qiita.com/cognitom/items/e3ac0da00241f427dad6