node项目中的js文件通过require引入图片

webApp 项目实现 vux ui框架结合require引入图片路径

• 首先引入alert弹框组件
  1. 全局引入

  // 在入口文件全局引入 node中是src下的main.js
  import Vue from 'vue'
  import { Alert } from 'vux'
  Vue.component('alert', Alert)
  

  2. 局部引入

  import { Alert } from 'vux'
  export default {
    components: {
      Alert
    }
  }
  

• 调用组件

     this.$vux.alert.show({
        title: '扫描二维码下载app查看视频', 
        //路径可在build/webpack.base.conf.js 中进行路径的修改
        content: "<img src="+require('~/998-app.png')+" width='150px' height='150px'/>"
      })

• 修改路径

module.exports = {
	resolve: {
	    extensions: ['.js', '.vue', '.json'], //以这些后缀结尾的文件 在引入时不用加后缀
	    alias: { //路径别名
	      'vue$': 'vue/dist/vue.esm.js',
	      '@': resolve('src'),
	      '~': resolve('static')
	    }
	},
}