前端部署
Docker 部署 Vue 项目:Nginx 镜像配置与构建全流程

本文详细讲解如何使用 Docker 和 Nginx 部署 Vue 项目。首先打包 Vue 项目生成 dist 目录,接着拉取 Nginx 镜像并配置 default.conf 以支持 History 模式路由。通过编写 Dockerfile 将构建产物与配置文件整合,最终使用 docker build 命令生成应用镜像,实现静态资源的高效托管。

10.23
热度 223
Webpack 生产环境配置:缓存优化、代码分离与懒加载实战

本文详解 Webpack 生产环境配置,涵盖通过 alias 和 noParse 优化构建、利用 CommonsChunkPlugin 分离第三方库、配置多重入口适配多端,以及深入解析 chunkhash、contenthash 与异步模块缓存策略,结合 ExtractTextPlugin 和 html-webpack-plugin 实现自动化部署。

10.22
热度 256
Vue项目打包JS文件过大的优化方案与实战

本文针对Vue项目打包后JS文件体积过大导致首屏加载缓慢的问题,提供多种优化策略。主要方法包括组件按需加载以减少冗余代码、通过CDN引入第三方库、配置路由懒加载、关闭SourceMap以及启用Gzip压缩。文中详细列出了webpack配置修改、插件安装及Nginx服务器配置的具体步骤,并对比了优化前后的文件大小变化,帮助开发者有效提升项目加载性能。

10.25
热度 611
Nginx与Vue.js实现前后端分离架构详解

本文详解如何利用Nginx的高性能反向代理与静态资源处理能力,结合Vue.js的前端渲染优势,构建前后端分离架构。通过Nginx拦截静态资源并代理动态JSON请求,Vue.js负责页面渲染与交互,有效解决跨域、带宽压力及开发效率问题。文章包含Nginx配置、Java后端JSON返回及Vue前端调用的完整代码示例。

10.22
热度 377
Jenkins结合Docker与Nginx部署Vue前端项目实战

本文详细记录了使用Jenkins、Docker、Nginx和Node.js构建Vue前端项目持续集成与部署环境的具体步骤。内容涵盖从Jenkins自由风格Job配置、Node.js工具设置,到Shell脚本执行构建、Dockerfile编写及Nginx配置文件调整的全过程。通过实际案例展示了如何在单服务器环境下完成从代码拉取、编译打包到镜像构建与容器启动的完整流程,并简要提及了涉及Harbor仓库的多节点部署方案。

10.25
热度 203
Vue Router History 模式在 Nginx 非根路径下的配置指南

本文详解 Vue Router 从 Hash 模式切换至 History 模式的必要性,并重点介绍在 Nginx 中配置非根路径(如 /A、/B)的方法。通过对比根路径与非根路径配置,强调使用 alias 而非 root 指令的关键点,确保 SPA 应用在不同子路径下刷新页面时能正确加载 index.html。

10.22
热度 229

标签目录

JavaScript 核心技术JavaScript 基础JavaScript 函数与作用域JavaScript 对象与原型JavaScript 数组与数据处理JavaScript 异步编程JavaScript 项目实战
浏览器与 Web 开发DOM 与事件浏览器 API网络请求与通信浏览器数据存储前端调试前端安全
前端框架与应用VueReactNext.jsNuxt前端状态管理前端性能优化
TypeScript 与工程化TypeScript前端构建依赖管理自动化测试前端部署代码规范与重构
Node.js 后端开发Node.js 基础Node.js Web 框架数据库开发接口开发与鉴权服务部署与运维Node.js 性能优化
AI 开发与应用大模型 API 开发AI 智能体开发RAG 与知识库AI 编程工具AI 多模态应用AI 应用部署