美文网首页
vue中store自动导入模块

vue中store自动导入模块

作者: narcissus灬 | 来源:发表于2019-10-15 11:19 被阅读0次

    方法:使用webpack中提供的require.context()
    webpack官方文档requirecontext
    vue基础组件的自动化全局注册

    import Vue from 'vue'
    import Vuex from 'vuex'
    
    /* 批量导入./module下的所有模块 */
    const path = require('path') 
    const files = require.context('./module', false, /\.js$/)
    const modules = {}
    files.keys().forEach(key => {
      const name = path.basename(key, '.js')    // 回key的最后一部分
      modules[name] = files(key).default || files(key)
    })
    
    Vue.use(Vuex)
    
    export default new Vuex.Store({
      modules: modules
    })
    
    require.context(directory, useSubdirectories = true, regExp = /^\.\/.*$/)
    
    • directory:目录
    • useSubdirectories :是否加载子目录
    • regExp:正则表达式,需要匹配的文件

    context module API
    context module导出一个(require)函数,该函数接受一个参数:请求。
    导出的函数有3个属性:resolvekeysid

    • resolve: 是一个函数,返回解析请求的模块ID。
    • keys: 是一个函数,它返回一个可以被context处理的所有可能请求的数组。

    相关文章

      网友评论

          本文标题:vue中store自动导入模块

          本文链接:https://www.haomeiwen.com/subject/segjmctx.html