将vue js文件导入laravel

kr98yfug 于 2023-04-21 发布在 Vue.js

关注(0)|答案(3)|浏览(130)

我使用these vue js files在Larval中构建我的表单。
当我在Larval中调用这些文件时，我得到一个空白页。
我的文件结构如下：

app.js文件的内容如下：

import Vue from "vue"
import App from "./components/App.vue"
import store from "./components/store"
import VeeValidate from "vee-validate"
Vue.use(VeeValidate);
import "./components/directives"
Vue.config.productionTip = false;
new Vue({
    store,
    render: h => h(App)
}).$mount("#app");

当然，当我运行nmp run watch的命令时，我得到了下面的警告。
./resources/js/app.js 5：8-19中的警告“export 'default'（import as 'VeeValidate'）was not found in 'vee-validate' @ multi ./resources/js/app.js ./resources/sass/app.scss
我的问题是：* 如何将外部vue js文件导入laravel项目？*

vue.js

来源：https://stackoverflow.com/questions/58502545/import-vue-js-file-to-laravel

3条答案

按热度按时间

qeeaahzv1#

首先，您需要像这样将app.js包含到刀片文件中

<script src="{{asset('js/app.js')}}"></script>

之后，如果你想在你的刀片应用程序中使用vue js组件，你需要在你的app.js中定义它们，如下所示：

Vue.component('home', require('path to your component').default);

并在刀片式服务器的div #idd下添加标签<home></home>

赞(0）回复(0）举报 2023-04-21

f4t66c6m2#

使用src="{{ mix（'js/app.js'）}}”

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" value="{{ csrf_token() }}" />
    <title>VueJS CRUD Operations in Laravel</title>
    <link href="{{ mix('css/app.css') }}" type="text/css" rel="stylesheet" />
</head>

<body>
    
    <div id="app">
        
    </div>

    <script src="{{ mix('js/app.js') }}" type="text/javascript"></script>
</body>
</html>

赞(0）回复(0）举报 2023-04-21

uttx8gqw3#

我遇到了一些问题，尝试使用vue-router版本3使用：