как импортировать компоненты для добавления их в маршруты с помощью Vue и VueRouter - PullRequest
Новая
       1

как импортировать компоненты для добавления их в маршруты с помощью Vue и VueRouter

0 голосов
/ 22 февраля 2019

в моем проекте у меня есть папка под названием views, для моих просмотров в спа-центре я пытаюсь избежать импорта каждого элемента вручную, возможно ли это?

для объявления компонентов, которые я исследовал этим методом. 

const files = require.context('./', true, /\.vue$/i)
files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], 
                files(key).default))

как это сделать, если синтаксис: 

import  Home from '../views/Home ';

Я пробовал это, потому что это идея, но она, очевидно, отмечает меня как ошибку, какое было бы лучшее решение?

const files = require.context('../views/', true, /\.vue$/i)
files.keys().map(key => {
    import  key.split('/').pop().split('.')[0] from '../views/'+  files(key);
})

/* Routers */
export default  [
/* Rutas de Venta venta */
{ 
    path: '/', 
    name: 'home',
    component: Home,
},

1 Ответ

0 голосов
/ 22 февраля 2019

Крис Фриц говорил, где объяснял это

Его презентация в github

Я нетак много понимаю этот код, но он работает 

import Vue from 'vue'
import upperFirst from 'lodash/upperFirst'
import camelCase from 'lodash/camelCase'

// Require in a base component context
const requireComponent = require.context(
    './components', false, /base-[\w-]+\.vue$/
);

requireComponent.keys().forEach(fileName => {
    // Get component config
    const componentConfig = requireComponent(fileName)

    // Get PascalCase name of component
    const componentName = upperFirst(
        camelCase(filename.replace(/^\.\//,'').replace(/\.\w+$/, ''))
    )

    // Register component globally
    Vue.component(componentName, componentConfig.default || componentConfig)
})
...