文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    前后端分离探索——MVC 项目升级的一个过渡方案

    + Vue 前端编译使用 Laravel Mix 工具，这会节省大量前端配置时间 根目录新建文件 webpack.mix.js const fs = require('fs'); const mix...= require('laravel-mix'); const rs_root = 'public/mix/resources'; // 资源 源目录 const rs_output = 'public...# 局限 不能做到全局自动加载组件 编译后的文件大小可能会很大 # 优势 可以更好地编写复杂的页面 更好的维护性 # 权限交互 ?...# 更新 2020/03/13 随着页面重构，文件越来越多，导致编译后总文件大小足足 150 M，而且 Git 合并困难，大大降低了开发效率和前端性能，这明显不合预期； 分析原因：每个页面都引入了公共模块...9 10 11 # laravel-mix 配置 const path = require('path') const mix = require('laravel-mix') const rs_root

    1.7K20

    让 F5 歇一会儿——laravel-mix 自动刷新之道

    因为近几年来大部分时假在与 Laravel 打交道，使用 laravel-mix 已成家常便饭，所以想着总结并分享一下 laravel-mix 工作流中的自动刷新之道。...要在 laravel-mix 中使用 hmr，不需要安装其它额外的依赖包。...在 webpack.mix.js 中根据实际场景配置 hmr 参数 // 配置 hmr 参数 mix.options({ hmrOptions: { host: 'laravel-mix-autoreload-demo.test...files 规则所包含的前后端文件 前端模块（即 webpack 加载的模块） 浏览器当前页面所加载的前端文件 速度 修改 css 时较快，其它文件时一般 快，特别是热替换时 一般 可靠性 可靠 存在...但同时需要注意的是 laravel-mix 环境下使用 hmr 也存在一些问题（当前最新版本 4.0.15 中仍存在），例如与 mix.extract() 没法同时使用( 见 Issue ) 以及在windows

    3K20

    将博客主题替换成 Clean Blog

    在 public 目录下新建 js 子目录用于存放编译打包后的 JavaScript 脚本文件。...，通过 Laravel Mix 来编译打包这些预处理 js 文件： const mix = require('laravel-mix') mix.js('resources/js/app.js', '...public/js'); 上述代码的含义是引入 Laravel Mix，然后通过它提供的 js 方法将 resources/js/app.js 进行编译打包，然后将处理后的 app.js 文件分发到...然后在 webpack.mix.js 中补充对应的处理逻辑： const mix = require('laravel-mix') mix.js('resources/js/app.js', 'public...5、编译前端资源文件 完成以上编码后就可以在项目根目录下执行 npm run dev 编译打包前端资源了： ? 编译成功后，就可以在 public 目录下看到对应的新文件了： ?

    1.3K20

    10 个让你的 PHP 开发工作更轻松的插件

    在 PHP 开发中，插件是提升生产力、扩展功能的强大工具。...以下精选了十款值得每个开发人员考虑的 PHP 插件，助您轻松驾驭开发之旅： 1、Composer：依赖管理的利器 Composer 是 PHP 项目依赖管理的行业标准，它让您轻松声明项目所需的库，并自动处理其安装...6、Laravel Mix：高效的资产管理利器 Laravel Mix 虽然与 Laravel 框架紧密相连，但它强大的资产编译功能使其适用于任何 PHP 项目。...跨浏览器兼容性：确保编译后的资产在不同浏览器中都能正常运行。...与版本控制集成：可以与 Git 等版本控制系统集成，在提交代码时自动进行代码风格检查和修复。 结论 这些插件是 PHP 开发人员工具库中不可或缺的一部分，它们能显著提升您的开发效率和代码质量。

    89310

    Laravel Mix 初探

    Laravel 上面的安装 Laravel 5.4 以上默认已经安装了 Laravel Mix， 在开发机配置了node 和 npm的基础上，仅仅只需要运行下面的命令即可安装： npm install...配置 Laravel Mix 现在在根目录下就应该可以看到一个webpack.mix.js文件，他是 Laravel Mix 的配置文件，和我们平时看到的 webpack.config.js 长得不太一样...| package.json webpack.mix.js 接下来写一个简单的 Laravel Mix 配置文件, webpack.mix.js let mix = require('laravel-mix...常用的case 版本控制和清理缓存 开发者经常会使用在编译后的资源文件名加上时间戳或者是唯一的token作为版本号，强迫浏览器加载全新的资源文件，而不是缓存的文件。...因此，你应该在你的视图中使用 Laravel 的全局辅助函数 mix 来正确加载名称被哈希后的文件。

    5.3K60

    Homestead + laravel-mix 环境下 hmr 的两种玩法

    我在前几天刚写过的《让 F5 歇一会儿——laravel-mix 自动刷新之道》[1]中介绍了 laravel-mix 实现自动刷新的几种方法，其中就有涉及 hmr（Hot Module Replacement...对于 Laravel 官方首推的 Homestead 当然也是可以的，只不过用法上有些差别，于加上 laravel-mix 本身的一些 BUG（在 issue 里搜索 hmr 结果就有好几页 :smile...1.vagrant ssh 连接虚拟机，进入项目目录后安装前端依赖 yarn install 2.在 webpack.mix.js 中调整相关配置 使用 mix.Webpack() 配置 devServer...在虚拟机终端中执行yarn run hot，然后在浏览器中使用绑定的测试域名（如：laravel.test）访问 34.修改 JS 等，自动编译后浏览器中页面即自动更新 玩法二：使用宿主机中的 Node...（虽然可以考虑在宿主机全局安装依赖，但诸如 eslint-config-xxx 之类的项目相关的包也全局安装，必然造成混乱） 如同学习很多其它新工具新玩法一样，刚开始折腾 laravel-mix 时总是磕磕绊绊

    2.2K10

    页面布局（下）：引入 Tailwind CSS 框架构建博客应用 UI 界面

    基于 Laravel Mix 引入 Tailwind 在 Laravel 项目中，我们可以基于 Lavavel Mix 快速引入 Tailwind CSS 框架，开始之前，先安装 laravel-mix-tailwind...这个前端依赖包： npm install laravel-mix-tailwind --save-dev 安装完成后，需要在项目根目录下的 webpack.mix.js 中引入它： const mix...= require('laravel-mix'); require('laravel-mix-tailwind'); ......(); 由于 laravel-mix-tailwind 依赖 tailwind.js，所以还需要通过如下命令初始化 Tailwind： npx tailwindcss init 如果上述命令运行报错..., function () { return view('app'); }); 另外，我们在 PhpStorm 插件市场中安装下面这个 Tailwind 语法智能提示插件，从而提高编写 Tailwind

    3.6K20

    Laravel中运行Gulp任务的利器（一） —— Laravel Elixir简介及入门教程

    在本节中，我们会展示如何创建并执行与Laravel应用紧密结合的Elixir任务，但在这之前，可能很多人还不太了解什么是Gulp，所以我们将从这里开始，逐一为你解开Elixir的面纱。...你可以通过编写Gulp任务来自动构建这些令人头痛的任务，并且可以通过集成成百上千的 Gulp插件 来有效节省时间，避免重复造轮子。...Gulp安装完成后就可以安装Elixir了！...2、安装Elixir Laravel 5 安装完成后在项目根目录下自动包含了一个名为 package.json 的文件，该文件内容如下： { "devDependencies": {...在该文件中，可以看到一个Gulp任务示例： elixir(function(mix) { mix.less('app.less');}); mix.less 任务可以用于编译Less文件，在本例中该文件名为

    2.7K91

    【Laravel系列7.8】广播系统

    不过问题就来了，在 Laravel8 相关的文档中，关于 redis 和 socket.io 的内容基本上没了。所以我们需要去参考 Laravel6 以及更低版本的文档。这个大家在查阅的需要注意哦。...Laravel 队列监听处理后的内容会到 laravel-echo-server 中，并由 laravel-echo 的服务端进行对前端的广播。...在初始化时选项的内容都是很简单的英文啦，相信各位大佬的英文水平是没问题的。然后我们找到在当前目录下生成的 laravel-echo-server.json 文件，修改 devMode 为 ture 。...修改完成之后，我们需要使用 Laravel 默认的 mix 工具来编译一下前端代码，最后需要加载的文件实际上是 public/js/app.js ，直接使用下面的命令行进行编译即可。...在具体的页面中，我们直接去调用它的 channel() 方法，给一个指定的频道名称，然后监听这个频道中的具体事件，也就是我们在 Laravel 中定义的事件类名。

    3.5K20

    基于独立的 Laravel Eloquent 组件编写 ORM 模型类

    下载 Eloquent ORM 相关扩展包 Eloquent ORM 作为 Laravel 框架自带的 ORM 实现，还可以在 Laravel 框架之外作为独立的 ORM 组件使用。...Eloquent 提供的模型事件功能，还可以下载 Laravel 提供的独立事件扩展包： composer require illuminate/events 上述扩展包下载完成后，就可以在博客项目根目录下的...initDatabase($container); return $container; } 基于 Eloquent 基类编写模型类 在应用启动阶段完成以上初始化操作后，就可以基于 Eloquent...完成以上重构后，运行 composer dump-auto 更新自动加载文件，让新增命名空间与目录路径映射关系生效，访问博客应用，首页、专辑页、文章页显示正常，表明代码重构成功。...MVC 模式在博客应用中的落地，下篇教程，我们将探索如何通过现代工程化的方式管理前端资源和依赖，我们将引入 NPM、Webpack、Laravel Mix、jQuery 和 Bootstrap，并基于这些工具和框架替换博客应用主题

    3.5K10

    laravel + passport + vue安装过程中遇到的麻烦

    1、 Conclusion: don't install laravel/ui v2.4.1 Conclusion: remove laravel/framework v6.18.40 laravel...~~app.js就应该放在.blade.php文件里，但同时改文件里面也有vue写法，说明引入app.js后就可以使用vue语法了（即使用.blade.php文件来写也可以）？...（好像对，文件太大一个都够慢了） 那登录界面不加载spp.js，在其他真正的首页加载不就OK了？但是为啥删掉app.js就没有好看的样式了呢？...---- 样式（丑不丑）取决于css/app.css文件 app.js应该是vue.js在laravel里使用的时候，必须这样做的一个打包文件（囊括了普通vue项目的所有文件）吧！...NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix

    2K20

    如何将Pjax整合进网站，实现全站无刷新加载？

    答案是不需要的，已经有人封装好了JqueryPjax插件，我们只需用人家写好的插件即可。由于这款插件依赖于jquery,又依赖jq去操作pushState,所以必须下载1.7版本以上的JQ哦！...解决:用pjax的加载完成后的回调函数再次绑定即可！...script> $(document).on('pjax:send', function() { $(".loading").css("display", "block");//pjax链接点击后显示加载动画...}); $(document).on('pjax:complete', function() { $(".loading").css("display", "none");//pjax链接加载完成后隐藏加载动画...； }); pjax与百度编辑器代码高亮 使用pjax后，百度编辑器的代码高亮是没效果的，在回调中使用SyntaxHighlighter.all()是没任何效果的，我们只需在回调函数里调用下

    4.6K90

    基于SpringBoot的任务管理平台v1.0正式发布

    配置好git、github后，见下图，在github地址输入https://github.com/linhxx/taskmanagement.git，另外两个内容自行随意输入。 ?...安装完后，在操作系统连接mysql，并且新建一个数据库，名字叫做spring。...3、找到application.java文件，在idea中运行该文件。待文件编译完成后，在浏览器中，输入http://127.0.0.1:9091/toLogin，看到下面的页面，即正常加载： ?...其中，这里的分页插件以及项目增删改查的时候表格的刷新，都是通过jquery的插件jqgrid实现的，因此对信息的改动会实时反应到表格中。 4、任务管理 技术实现上，类似用户管理，不详细介绍。...4、domain 数据库表结构，里面的每个类都是数据库的一个表，而且里面类的每个属性就是表的每个列，同时定义getter和setter。

    2.1K50

    Laravel5.2之模型关联预加载

    说明：本文主要说明Laravel Eloquent的延迟预加载(Eager Loading)，使用延迟预加载来减少MySQL查询次数。同时，会将开发过程中的一些截图和代码黏上去，提高阅读效率。...开发环境：Laravel5.1+MAMP+PHP7+MySQL5.5 先写个店铺列表页 1.先装上开发插件三件套(具体可参考：Laravel5.2之Seeder填充数据小技巧) 不管咋样，先装上开发插件三件套...-- jQuery文件。...务必在bootstrap.min.js 之前引入 --> jquery/1.11.3/jquery.min.js"> 加载查询 (1)嵌套预加载 Eloquent在通过属性访问关联数据时是延迟加载的，就是只有该关联数据只有在通过属性访问它时才会被加载。在查找上层模型时可以通过预加载关联数据，避免N+1问题。

    3.5K41

    创建并运行一个新的 Laravel 项目

    安装完成后，后续就可以通过 laravel new [项目名称] 来创建新的 Laravel 项目了： laravel new blog 该命令会在当前目录下创建一个新的名为 blog 的应用： ?...2、Laravel 应用的目录结构 安装完成后，我们来看一下新安装 Laravel 项目 blog 的目录结构： ?...：Composer 配置文件 webpack.mix.js：Laravel Mix Webpack 配置文件，用于编译和打包前端资源 package.json：配置前端资源依赖和脚本（类似于 composer.json...这些配置文件都会返回一个数组，数组中的每个值都可以通过配置键获取（配置键以配置文件名为前缀，以「.」号分隔数组层级），例如，如果你在 config/services.php 中定义了如下配置： // config...（每个环境有自己独立的 .env 文件）使用不同的配置值，提高了代码的复用性和灵活性。

    8.6K30
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券