読者です 読者をやめる 読者になる 読者になる

基本的に怠Diary

学習ログを残したい

Riotjs入門したらコケた ~動作確認~

だから追いかけた。

qiita.com

とりあえずこの記事見て進めることに。

環境はVagrant上のCentOS7

npmは4.0.5

nodeは7.4.0

とりあえずこの記事ではbabelとbuble?を利用する2通りが存在するみたいで

私はbubleわからないのでbabelを選択。babelも対して理解してないけどね。

とりあえず要求通りにインスコし、ディレクトリ構成もしっかりと確認し、

コードもまず動くことが第一なのでコピペして入れて、npm run build

動かない。しかし今回はとっても優しいエラー文だった。

TypeError: _webpack2.default.optimize.OccurenceOrderPlugin is not a function

そんな関数ねーよ!ってことですねなるほどなるほどTypoかな?とりあえずぐぐる

そうすると以下のような記事を発見

github.com

そして下に進んでいくと

OccurenceOrderPlugin has been renamed to OccurrenceOrderPlugin.

英語わからないけど名前変わってOccurrenceOrderPluginになったよって書いてある。

なんかr増えてる。誰かがTypoしてるの見つけてそれを最近になって修正したってことかな。

まあとにかく動かしましょう。

すると再びエラー。まあこの程度で音を上げるようではnpmと付き合うのは不可能。

しかし今度のエラーは難しい。一部を取り出して検索してみる

(とりあえずconfiguration[0].module has an unknown property ‘preLoaders'をGoogleに放り込む)

すると

github.com

オッ

npm uninstall webpack --save-dev
npm install webpack@2.1.0-beta.22 --save-dev

これで・・・!

npmの仰々しいエラーはなくなったが、どうやらriot周りでエラーこいてる感じ。

普通に確認してみたらなんのこともない

app/app.jsのとこのパス指定が多分間違ってる。

require(‘../app.tag’);

ここ、ディレクトリ構成確認するとわかるけど

../tag/app.tag

なんだよね。

./ ├ .gitignore ├ node_modules ├ package.json ├ webpack.config.js ├ index.html ├ app │ └ app.js ←こいつが │ ├ tag │ └ app.tag ←こいつを読み込まないといけないので │ └ build └ bundle.js

そんなこんなで今度こそrun buildしたら無事記事の通り動作しました。

基本的にRiotjsの記事厳しいのばかりでしたがこの記事が一番優しく感じました。

対処も簡単だったしね。


動いたのはいいんだけどなんで動いてるのか一ミリもわからねえ。

恐らくriotではなくwebpackが理解できていない。

まあ2.1.0でいいかなという感想だけど恐らく今後使い続けてるとwebpack周りで死にそうだし

やっぱ調べとくか。気が向いたらやる()