Как интегрировать шаблон панели мониторинга в Vuejs в проект Laravel 5.7 - PullRequest
0 голосов
/ 18 октября 2018

Я тщательно следовал рекомендациям по документации CoreUI для интеграции темы в разработку vuejs, эта тема разработана с конкретными компонентами для интеграции в среду vuejs.В указанной документации указываются следующие команды для установки, которые я выполнил:

git clone https://github.com/coreui/free-bootstrap-admin-template.git my-project
$ cd my-project
$ npm install.

После выполнения я скопировал файлы из папки / src в / resources проектов laravel и добавил:

mix.js('resources/js/app.js', 'public/js')
	.js('resources/js/bootstrap.js', 'public/js')
  /*This is the mainjs on template /src*/
	.js('resources/js/main.js', 'public/js') /*This line is added*/
   	.sass('resources/sass/app.scss', 'public/css');

mix.browserSync({
   	    proxy: 'http://localhost:8000'
   	});

Для веб-пакета для компиляции файла code /main.js, который выполняет зависимость от шаблонов

после выполнения «npm run watch», генерируется следующая ошибка:

ERROR in ./resources/js/router/index.js
Module build failed: SyntaxError: Unexpected token (68:31)

  66 | 
  67 | // Views
> 68 | const Dashboard        = () => import('@/views/Dashboard')
     |                                ^
  69 | 
  70 | const Colors           = () => import('@/views/theme/Colors')
  71 | const Typography       = () => import('@/views/theme/Typography')

после кодификации строк, содержащих

const Dashboard        = () => import('@/views/Dashboard')

и замены их на

import Dashboard        from 'resources/js/views/Dashboard.vue'

, выдает еще одну ошибку:

ERROR in ./resources/js/router/index.js
Module build failed: SyntaxError: Unexpected token (64:31)

  62 | 
  63 | Containers
> 64 | const DefaultContainer = () => import('resources/js/views/Dashboard.vue')
     |                                ^
  65 | 
  66 | 
  67 | // // Views

документация по реализации шаблонов vuejs в проектах laravel очень ограничена, что затрудняет реализацию этих шаблонов.Было бы очень полезно, если вы прокомментируете предложения или решения по этому вопросу.

1 Ответ

0 голосов
/ 19 октября 2018

Вам следует попробовать это:

const Dashboard = () => System.import('@/views/Dashboard');

Почему-то я никогда не получал импорт для работы без System в проекте Vue на основе laravel.Это исправило проблему для меня.Также вы можете установить:

const import = System.import();

В верхней части маршрутизатора, чтобы вам не пришлось изменять все ваши импорты.

...