• 技术文章 >php框架 >Laravel

    分享一个​Laravel Mix编译Vue踩坑记录

    藏色散人藏色散人2021-09-13 15:30:10转载100
    下面由Laravel教程栏目给大家分享一个Laravel Mix 编译 Vue 踩坑记录,希望对需要的朋友有所帮助!

    Laravel Mix 编译 Vue 踩坑记录

    环境:

    // package
    "laravel-mix": "^6.0.6",
    // composer
    "laravel/framework": "^8.54"
    node version v15.14.0
    npm version 7.7.6

    首先 npm 需要安装依赖 vue, vue-loader, vue-template-compiler

    然后打开 webpack.mix.js 文件

    // 将
    mix.js('resources/js/app.js', 'public/js')
    // 修改为
    mix.js('resources/js/app.js', 'public/js').vue()

    打开 /resources/js/app.js

    import Vue from 'vue'  // 必须引入 vue 
    require('./bootstrap');
    Vue.component('welcome-component', require('./components/WelcomeComponent.vue').default); // 组件后需要添加 .default 否则会报错
    const app = new Vue({
        el: '#app'
    });

    执行,关于 .default 的说明看这里 https://github.com/vuejs/vue-loader/releases/tag/v13.0.0

    npm run dev

    到此就差不多了,使用 Laravel-Mix 6 之后有一些变化,这里记录一下。

    以上就是分享一个​Laravel Mix编译Vue踩坑记录的详细内容,更多请关注php中文网其它相关文章!

    声明:本文转载于:learnku,如有侵犯,请联系admin@php.cn删除
    专题推荐:Laravel
    上一篇:laravel一键安装包安装及HTTP基础路由详解 下一篇:【笔记整理】laravel HTTP中间件的介绍及创建
    线上培训班

    相关文章推荐

    • 【laravel】blog项目实战笔记-弹窗外部插件的引用及后台文章分类的添加编辑等• 类库管理器composer安装和配置laravel• PHP框架这么多,为什么更喜欢用Laravel8?• laravel一键安装包安装及HTTP基础路由详解

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网