Rails
vue.js

[Rails5.1][Vue.js] 動かそうとするとコンポネントエラーになる問題

Rails5〜から、Webpackerが使いやすくなったのですが
Vue.jsを載せて動かそうとすると以下エラーが発生します。

[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

解決法

この問題の解決法は、以下の記事で紹介されています。
http://qiita.com/magaya0403/items/3fbe9aa20c6a66b76662

紹介されている通りWebpackのconfigファイルに "aliasを追加する" ことで解決できるのですが、自分のProjectにはconfig/webpack/shared.jsが見当たりませんでした。

なので今回は他のconfigファイルにaliasを追加し、このエラーを回避する方法を見つけたので紹介させていただきます。

config/webpack/production.js
const environment = require('./environment')

module.exports = Object.assign({}, environment.toWebpackConfig(), {
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js'
    }
  }
})
config/webpack/development.js
const environment = require('./environment')

module.exports = Object.assign({}, environment.toWebpackConfig(), {
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js'
    }
  }
})
config/webpack/test.js
const environment = require('./environment')

module.exports = Object.assign({}, environment.toWebpackConfig(), {
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js'
    }
  }
})

それぞれの環境のconfigファイルにObject.assignを使ってあげれば動作します。