繁体   English   中英

Netlify Vue 构建无法找到导出模块

[英]Netlify Vue Build Failing To Find Export Modules

所以我有几个模块要导入到我的main.jsstore.js文件中,但在 Netlify 中构建时找不到这些模块,我不明白为什么。 当我在本地运行构建时,没有问题。

所以这两个文件是ability.jsstorage.js

这是 netlify 中构建的警报

12:48:10 PM: These relative modules were not found:
12:48:10 PM: * ./utils/ability.js in ./src/main.js, ./src/store.js
12:48:10 PM: * ./utils/storage.js in ./src/store.js
12:48:10 PM:  ERROR  Build failed with errors.

这是ability.js文件

import { Ability } from '@casl/ability'

export const ability = new Ability()

export const abilityPlugin = (store) => {
    ability.update(store.state.rules)

    const rules = store.subscribe((mutation) => {
        switch (mutation.type) {
            case 'createSession':
            ability.update(mutation.payload[0])
            break
            case 'destroySession':
            ability.update([{ actions: '', subject: '' }])
            break
        }
      })
      return rules
  }

这是 storage.js 文件

export default (options) => (store) => {
    if (localStorage.state) {
      const storedState = JSON.parse(localStorage.state)
      store.replaceState(Object.assign(store.state, storedState))
    }

    return store.subscribe((mutation, state) => {
      if (options.destroyOn && options.destroyOn.indexOf(mutation.type) !== -1) {
        return localStorage.removeItem('state')
      }

      const newState = options.storedKeys.reduce((map, key) => {
        map[key] = state[key]
        return map
      }, {})

      localStorage.state = JSON.stringify(newState)
    })
  }

这是我导入这些模块的 2 个文件

主文件

import Vue from 'vue';
import App from './App.vue';
import router from './router';
import store from './store';
import { abilitiesPlugin } from '@casl/vue';
import { ability } from './utils/ability.js';

Vue.use(abilitiesPlugin, ability);

new Vue({
  router,
  store,
  render: h => h(App),
}).$mount('#app')

商店.js

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import { abilityPlugin, ability as appAbility } from './utils/ability.js'
import storage from './utils/storage.js'

export const ability = appAbility
Vue.use(Vuex)
axios.defaults.baseURL = 'https://aewcpa.traxit.pro/api'
axios.defaults.headers.common['header1'] = {
  'X-Requested-With': 'XMLHttpRequest',
}



export default new Vuex.Store({
  plugins: [
    storage({
      storedKeys: ['rules', 'token'],
      destroyOn: ['destroySession']
    }),
    abilityPlugin
  ],
})

有问题的目录结构

在此处输入图片说明

当前有效的目录结构

在此处输入图片说明

Utils 是否在您项目的根目录中? 你在使用 Vue Webpack 模板吗?

如果是这样,则为您配置了 @ 解析器( 使用 Webpack 的 vue.js 项目中使用 at ('@') 登录路径的 ES6 导入

如果是这样改变:

from './utils/ability.js'from '@/utils/storage.js'

from './utils/storage.js'from '@/utils/storage.js'

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM