dist文件打包配置指南

今天为大家介绍打包后dist目录的配置方法，助你轻松完成项目部署。

1、 在项目源码的 `src/components/` 目录下新建一个名为 `New.vue` 的单文件组件。该组件包含基础结构：模板部分渲染一个标题区域，主标题为vue-router懒加载，副标题为new doc；脚本部分采用标准导出语法，定义一个空的 Vue 组件对象；样式部分仅设置一级标题文字颜色为红色，使用内联 `

2、 在 `src/router/index.js` 文件中，需引入 Vue 和 Vue Router，并导入相关页面组件。具体操作为：首先通过 `import Vue from vue` 和 `import Router from vue-router` 加载核心依赖；接着导入如 `Hello`、`New` 等业务组件，路径需根据实际目录结构准确填写；随后创建路由实例，配置路径与对应组件的映射关系；最后调用 `Vue.use(Router)` 注册插件，并导出该路由对象，供主应用挂载使用。

3、 接下来执行文件打包操作，运行 `npm run build` 命令。构建完成后，直接在浏览器中打开生成的页面即可访问；若无法正常加载，请自行排查环境配置问题，例如检查 Nginx 服务是否已正确部署并启用。