# Solidity Hot Loader with Vue

**URL:** <https://forum.openzeppelin.com/t/solidity-hot-loader-with-vue/3104>\
**Category:** General\
**Created:** [June 12, 2020, 5:36pm UTC](https://forum.openzeppelin.com/t/solidity-hot-loader-with-vue/3104 "2020-06-12T17:36:57Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Skyler\_Fly](https://sea2.discourse-cdn.com/flex022/user_avatar/forum.openzeppelin.com/skyler_fly/32/1901_2.png) [@Skyler\_Fly](https://forum.openzeppelin.com/u/Skyler_Fly)\
**Post date:** [June 12, 2020, 5:36pm UTC](https://forum.openzeppelin.com/t/solidity-hot-loader-with-vue/3104/1 "2020-06-12T17:36:57Z")

</div>

Hey, I am trying to get this ([Building an OpenZeppelin dapp with Solidity Hot Loader](https://forum.openzeppelin.com/t/building-an-openzeppelin-dapp-with-solidity-hot-loader/1843)) up and running in my Vue projects.  
I found these resources so far:  
[https://cli.vuejs.org/guide/webpack.html#chaining-advanced](https://cli.vuejs.org/guide/webpack.html#chaining-advanced)  
[https://github.com/neutrinojs/webpack-chain](https://github.com/neutrinojs/webpack-chain)  
[https://github.com/OpenZeppelin/solidity-loader](https://github.com/OpenZeppelin/solidity-loader)

I have it setup like so in my vue.config.js file

```
module.exports = {
  transpileDependencies: ['vuetify'],
  chainWebpack: (config) => {
    config.module
      .rule('sol')
      .test(/\.sol$/)
      .use('json-loader')
      .loader('json-loader')
      .end()
      .use('@openzeppelin/solidity-loader')
      .loader('@openzeppelin/solidity-loader')
      .tap((options) => {
        return {
          network: 'development',
          disabled: false,
        }
      })
  },
}

```

And the relevant output when inspected looks like this.

```
  /* config.module.rule('sol') */
  {
    test: /\.sol$/,
    use: [
      /* config.module.rule('sol').use('json-loader') */
      {
        loader: 'json-loader'
      },
      /* config.module.rule('sol').use('@openzeppelin/solidity-loader') */
      {
        loader: '@openzeppelin/solidity-loader',
        options: {
          network: 'development',
          disabled: false
        }
      }
    ]
  }

```

Wish me luck on getting this up and running. If it works I want to make this all work with a 1 line command to setup new projects with a Vue-CLI plugin.

---

<div class="post-metadata">

**Author:** ![abcoathup](https://sea2.discourse-cdn.com/flex022/user_avatar/forum.openzeppelin.com/abcoathup/32/415_2.png) [@abcoathup](https://forum.openzeppelin.com/u/abcoathup)\
**Post date:** [June 15, 2020, 9:00am UTC](https://forum.openzeppelin.com/t/solidity-hot-loader-with-vue/3104/2 "2020-06-15T09:00:05Z")

</div>

Hi @Skyler_Fly,

Good luck. Let the community know how you get on.
