Мне нужна помощь с настройкой материалов-веб-компонентов для работы с компонентами vue.js.Ошибка возникает, когда я хочу импортировать компонент @material scss в компонент vue.
SomeVueComponent.js:
<style lang="scss">
@import '@material/textfield/mdc-text-field.scss';
</style>
Ошибка состоит в том, что некоторые компоненты @material импортируют другой компонент @material.scss, но не может быть найден из-за includePaths, который я исправил, добавив этот код в мой файл laravel-mix:
webpack.mix.js:
mix.webpackConfig({
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
scss: 'vue-style-loader!css-loader!sass-loader?' + JSON.stringify({
includePaths: ['node_modules']
})
}
}
}
]
}
});
После сохранения этого файлавсе компилируется правильно, но теперь я получаю эту ошибку для всех моих компонентов vue на сайте:
[Предупреждение Vue]: не удалось смонтировать компонент: шаблон или функция визуализации не определены.
ПослеВ течение всего дня изучения того, как это исправить, я обнаружил, что конфликт генерируется, потому что я загружаю vue-загрузчик 2 раза с помощью веб-пакета (по умолчанию + мой пользовательский).
Кто-нибудь знает обходной путьо том, как это сделать?Это было бы очень полезно.
Я использую:
- laravel 5.7.8
- laravel-mix 4.0.15
- vue 2.6.10
- vue-loader 15.4.2
- webpack 4.27.1
Я уже пробовал новый способ импорта компонентов vue после vue-loader v13 +.(Добавление .default после требуемого) Ошибка все та же.
Vue.component('some-vue-component', require('./components/SomeVueComponent.vue').default);