Question

我已经严格遵循CoreUI文档指南来进行该主题在vuejs开发中的集成，该主题是使用特定组件设计的，用于在vuejs环境中进行集成。所述文档为安装指定了以下命令，我执行了该命令：

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

执行后，我将文件从/ src文件夹复制到laravel项目的/ resources中，我还添加了：

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'
   	});

让Webpack编译文件的代码/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

关于laravel项目中vuejs模板实现的有效文档非常有限，这使得该模板的实现很困难。如果您评论有关此问题的建议或解决方案，那将非常有帮助。

Answer 1

您应该尝试以下操作：

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

由于某些原因，在基于laravel的Vue项目中，没有System我就无法工作。这为我解决了问题。您还可以设置：

const import = System.import();

位于路由器顶部，因此您无需修改所有导入内容。

如何将Vuejs中的仪表板模板集成到Laravel 5.7项目

1 个答案: