<h1>webpack環境でvelocityを使う</h1>
webpack環境でjQueryプラグインを使用すると、使えるようにするまでに一手間かかるときがある。今回もVelocityを使えるようにするまでに少し手間取ったが解決できたので書き残しておく。
[[toc]]
<h2>install</h2>
<div class="remark-highlight"><pre class="language-unknown"><code class="language-unknown">$ yarn add velocity-animate</code></pre></div>
<h2>webpack.config.jsに追記</h2>
<code>webpack.config.js</code>に下記のように追記
<div class="remark-highlight"><pre class="language-js"><code class="language-js">module.exports = {
 // ~ 省略
 plugins: [
 new webpack.ProvidePlugin({
 $: 'jquery',
 jQuery: 'jquery'
 Velocity: 'velocity-animate'
 })
 ]
}
</code></pre></div>
上記を追記すると、webpack環境で<code>Velocity</code>が使えるようになる。
あとは使いたいところで
<div class="remark-highlight"><pre class="language-js"><code class="language-js">Velocity(
 element,
 {
 // property
 },
 {
 // options
 }
)
みたいな感じで記述すれば動くはず

</code></pre></div>

webpack環境でjQueryプラグインを使用すると、使えるようにするまでに一手間かかるときがある。今回もVelocityを使えるようにするまでに少し手間取った。