Utilizing HTML targeting with data binding
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div class="row" v-for="test in tests">
<div class="col-12">
<router-link tag="a" :to="{ name:'test.index', params:{ id: test.id } }" >{{ test.name }}
</router-link>
</div>
<div class="col-12">
<img :src="(isTestURL && isPosted) ? '~/img/'+ 'testflow-img':'' + '.png'" class="img-fluid" />
</div>
</div>
Configuring Webpack mix
mix.webpackConfig({
resolve: {
alias: {
masonry: "masonry-layout",
isotope: "isotope-layout",
// custom aliases for easy reference
src: path.resolve(__dirname, "resources/assets/"),
assets: path.resolve(__dirname, "resources/assets/assets/"),
img: path.resolve(__dirname, "resources/assets/assets/img/")
}
},
The output shows img/testflow-img.png
, but there is no rendering. Similar to example.com/img/testflow-img.png
.
/images/testflow-img.png?1a2086faf6b06b086b9f10c5cc50eae2
Any suggestions would be greatly appreciated.