可以在laravel项目中集成2个项目vuejs

时间:2019-07-02 15:38:20

标签: laravel api vue.js

我想在Laravel项目中集成一个使用vuejs/vue-router构建的项目。 Laravel已经包含一些组件。 我将新的项目文件放在websiteName/public/admin中 然后把刀片放进去 ressources/view/front/admin/index.blade.php 这就是我的代码和配置webpack.mix.js

mix.js('resources/assets/js/app.js', 'public/js/app.js')
.js('resources/assets/admin/app.js','public/admin/app.js')

当我访问此路线页面时,什么都没有显示,并且出现此错误:

app.js:1108 Uncaught Error: Cannot find module 'C:\Users\dev\git\project\websiteName\resources\assets\admin\app.js'
    at webpackMissingModule (app.js:1108)
    at Object.<anonymous> (app.js:1108)
    at __webpack_require__ (app.js:1091)
    at app.js:1106
    at Object.publicAdminAppJs (app.js:1106)
    at __webpack_require__ (app.js:1068)
    at Object._ (app.js:1110)
    at __webpack_require__ (app.js:1068)
    at app.js:1083
    at Object.publicAdminAppJs (app.js:1083)

view.blade.php

<head>
    <meta charset=utf-8>
    <meta http-equiv=X-UA-Compatible content="IE=edge">
    <meta name=viewport content="width=device-width,initial-scale=1">
    <!--[if IE]><link rel="icon" href="/favicon.ico"><![endif]-->
    <link rel="icon" href="{{ asset('favicon.ico')}}">
    <title>Test Test</title>
    <link href="https://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700,900" rel=stylesheet type=text/css>
    <link href="{{ asset('admin/template/css/icons/icomoon/styles.min.css')}}" rel=stylesheet type=text/css>
    <link href="{{ asset('admin/assets/css/bootstrap.min.css')}}" rel=stylesheet type=text/css>
    <link href="{{ asset('admin/assets/css/bootstrap_limitless.min.css')}}" rel=stylesheet type=text/css>
    <link href="{{ asset('admin/assets/css/layout.min.css rel=stylesheet')}}" type=text/css> 
    <link href="{{ asset('admin/assets/css/components.min.css')}}" rel=stylesheet type=text/css>
    <link href="{{ asset('admin/assets/css/colors.min.css')}}" rel=stylesheet type=text/css>
    <link href="{{ asset('admin/assets/css/appCustom.css')}}" rel=stylesheet type=text/css>
    <link href="{{ asset('fontawesome/css/all.min.css') }}" rel="stylesheet">
    <link href="{{ asset('admin/css/app.210cc106.css')}}" rel=stylesheet>
    <link href="{{ asset('/img/icons/favicon-32x32.png')}}" rel=icon type=image/png sizes=32x32>
    <link href="{{ asset('/img/icons/favicon-16x16.png')}}" rel=icon type=image/png sizes=16x16>
    <link href="{{ asset('/admin/manifest.json')}}" rel=manifest>
    <meta name="csrf-token" content="{{csrf_token()}}"> 
    <meta name=theme-color content=#4DBA87>
    <meta name=apple-mobile-web-app-capable content=no>
    <meta name=apple-mobile-web-app-status-bar-style content=default>
    <meta name=apple-mobile-web-app-title content=rdv-web-app>
    <link href="{{ asset('admin/img/icons/apple-touch-icon-152x152.png')}}" rel=apple-touch-icon >
    <link href="{{ asset('admin/img/icons/safari-pinned-tab.svg color=#4DBA87')}}" rel=mask-icon >
    <meta name=msapplication-TileImage content=/img/icons/msapplication-icon-144x144.png> 
    <meta name=msapplication-TileColor content=#000000>
</head>

<body>
    <noscript>
        <strong>We're sorry but rdv-app doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id=app>

    </div>
    <script src="{{ asset('admin/template/js/main/jquery.min.js')}}"></script>
    <script src="{{ asset('admin/template/js/main/bootstrap.bundle.min.js')}}"></script>
    <script src="{{ asset('admin/template/js/plugins/loaders/blockui.min.js')}}"></script>
    <script src="{{ asset('admin/template/js/plugins/forms/styling/uniform.min.js')}}"></script>
    <script src="{{ asset('admin/assets/js/app.js')}}"></script>
    <script src="{{ asset('admin/template/js/demo_pages/login.js')}}"></script>
    <script src="{{ asset('admin/template/js/demo_pages/form_checkboxes_radios.js')}}"></script> 
    <script src="{{ asset('admin/template/js/plugins/tables/datatables/datatables.min.js')}}"></script>
    <script src="{{ asset('admin/template/js/plugins/forms/selects/select2.min.js')}}"></script>
    <script type="application/javascript" src="{{ mix('admin/app.js') }}"></script>
</body>

我试图同时使用: 混合和资产,但没有任何变化。 请帮忙;

更新我找到了解决方案:

sorry for my english:
step 1 = build vuejs project using vue-cli.
step 2 = create controller in laravel render blade.
step 3 = create blade in view ,copy the content index.html and paste it in blade
step 4 = use asset to link css/js files
step 5 = finally create route.

导航到路线

0 个答案:

没有答案