浅入深出Vue:发布项目
项目完成之后,当然不能满足于在我们的开发环境下跑一跑。我们可以打包发布到服务器上,让大家一起来欣赏一下你的作品。
那么 vue
项目如何打包发布呢,新建的项目目录下通常都有一个 README.md
的文件,里面就描述了发布的步骤:
下面这个是 vue-cli 3.x
创建的项目中的 README.md
文件内容:
# firstpage## Project setup
npm install
### Compiles and hot-reloads for development
npm run serve
### Compiles and minifies for production
npm run build
### Run your tests
npm run test
### Lints and fixes files
npm run lint
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
这里描述了常用的指令,我们需要的那一条就是:
npm run build
这运行这一条命令就可以将项目打包成一个 dist
目录,里面只有静态 html
和 js
文件。
打包
npm run build
运行上面的命令, 运行完成后就可以看到项目的根目录下面多了一个 dist
目录:
打开我们可以看到一个 index.html
,但是你直接打开是一片空白的。
这里就需要将其托管到一个 web容器
中,比如 iis
, apache
, nginx
等等,有兴趣的童鞋可以自己搭建上述中的一个然后将打包的目录上传上去看看效果。
写在最后
这个小项目其实瑕疵很多,包括登录后的逻辑,发布文章时登录的验证等等,但这个项目毕竟是一个用来熟悉 vue
框架的。因此若羽并没有打算在这个项目上花太多功夫,让其变成一个完整的、简洁的、真实可用的博客系统(其实已经完成大半的功能了),毕竟这样对于新手来说引入了太多不相关的因素,不能很好的专注在如何使用vue上。相信从头一步跟着文章学到这里的童鞋已经能够自己写出来一个真正的博客系统了,除了后端接口以外,不过这里我们可以使用 postman
的 mock
功能,系列文章中也有相关教程。
所有文章中的接口均是来自 postman
的 mock
功能噢。
后续的文章会开始实践如何优雅的写代码了。好的代码会增加可读性,降低团队协作的沟通成本,同时也能增强项目的可维护性、可扩展性等等。
从另一方面来看,代码能写的更好,为什么要写的差呢?
请务必无视网络中流传的所谓代码越烂越好,最好写到只有自己才能看得懂的地步,才会成为公司不可或缺的中流砥柱。
这不是优秀,不是生存宝典,而是不负责任!!!
成为公司中流砥柱、受部门领导和同事认可或者是更优秀的人,不是想着取巧,而是要真材实料(不一定是编码能力,比如能很好协调和同事之间的关系,可以为领导出谋划策,可以为团队带来欢乐、技术提升等等)。
不关从事哪一行,都要努力让自己变得更优秀,而不是捣乱。
代码越烂,那么越难以和别人沟通,如何进步?并且团队其他人无法阅读和维护,如何保持和同事在项目上的和谐?以后面试时,和面试官说曾经有一个只有你自己才能维护的系统,自己用了多少手段让同事没办法看懂代码么?如此作为,实在损人不利己。
这样达到中流砥柱的背后,不过是穷途末路后的挣扎而已。如此行为,谁还能信任你,哪天埋个雷把大家都 boom 了么。
因此,若羽在这里倡导并向大家提出建议:
- 为自己的代码负责,为自己负责。
从个人的角度:
可以让自己的代码更具可读性,不再害怕历史代码
方便的与他人交流
锻炼自己的思维,每一个变量名,函数名,文件名的思考都能让自己的思路更加清晰,每一个文件存在的位置,让自己对于项目的结构有着更清晰的认知
这里推荐两本书:
《代码整洁之道》
《重构改善既有代码的设计》
很值得一看。
转载于:https://www.cnblogs.com/By-ruoyu/p/11197274.html
浅入深出Vue:发布项目相关推荐
- 浅入深出Vue:环境搭建
浅入深出Vue:环境搭建 工欲善其事必先利其器,该搭建我们的环境了. 安装NPM 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版本的NodeJS Windows安装程序 下载下来后,直 ...
- 浅入深出Vue:子组件与数据传递
上一篇了解了组件的概念及在使用中需要注意的地方.在面对单个组件逻辑复杂需要拆分时,难免会遇到父子组件之间数据传递的问题.那么我们来了解一下在父子组件之间进行数据传递时需要遵循哪些约定,以及要注意哪些问 ...
- 浅入深出Vue:文章编辑
登录与注册功能都已经实现,现在是时候来开发文章编辑功能了. 这里咱们就使用 markdown 作为编辑语言吧,简洁通用.那么我们就需要找一下 markdown 的编辑器组件了,而且还要支持 vue噢. ...
- 浅入深出Vue:事件处理
上一篇的最后留下了一个 v-on的思考,也就是本章的主题:事件处理 为什么需要事件处理 在前端开发中,经常要面对各种表单.按钮.而这里面就住着一个事件:点击 (click). 前端童鞋们肯定不陌生它, ...
- 浅入深出Vue:注册
基本布局已经有了, 现在我们来开始做我们的注册页面~ 当然需要注册才能发表文章啊(糟老头子坏得很, 我可以只有我一个人能发啊). 这里我们设定只有注册才能发表文章,也就淡化了管理员这个概念.在开发中先 ...
- Angular浅入深出系列 - 写在前面
本系列目录: 写在前面 基础知识 控制器(Controller) 作用域(Scope) 集合(Collection) 模块(Module) 依赖注入(Dependency Injection) 服务( ...
- 浅入深出之Java集合框架(上)
Java中的集合框架(上) 由于Java中的集合框架的内容比较多,在这里分为三个部分介绍Java的集合框架,内容是从浅到深,如果已经有java基础的小伙伴可以直接跳到浅入深出之Java集合框架(下). ...
- 浅入深出之Java集合框架(中)
Java中的集合框架(中) 由于Java中的集合框架的内容比较多,在这里分为三个部分介绍Java的集合框架,内容是从浅到深,如果已经有java基础的小伙伴可以直接跳到浅入深出之Java集合框架(下). ...
- 处理中文乱码_浅入深出:一次提问引发的深思,从此再也不怕“乱码”问题
这是恋习Python之浅入深出系列第3篇原创首发文章 作者|丁彦军 来源|恋习Python(ID:sldata2017) 转载请联系授权(微信ID:2394608316) 近日,有位粉丝向我请教,在爬 ...
最新文章
- sar分辨率公式_初识合成孔径雷达SAR
- 递增的整数序列链表的插入_每日算法题 | 剑指offer 链表专题 (5)链表中倒数第k个节点...
- framebuffer结构体分析
- tomcat 的 start/stop shell script.
- 喜讯丨神策数据加入北京信创工委会!
- 关于 To B,我欠粉丝们一个热搜
- 爬虫实战:要不是热爱学习,谁会爬小姐姐。分析Ajax来爬取今日头条街拍美图(python)
- php 面向对象进阶,PHP面向对象进阶设计模式:解释器模式使用实例
- JavaScript的实现
- Guava学习笔记 第6个记录(Immutable(不可变)集合)
- OCI 完成 TOB 选举,阿里工程师入选全球 9 人名单
- xjad一款不错的java反编译软件
- 戴姆勒集团将拆分卡车业务;洲际酒店集团发布全新品牌标识;先正达集团中国创新研发中心落户南京 | 美通企业周刊...
- 2022.10月面具输入LSPosed框架以及隐藏root
- Modem2G/3G/4G/5G:吐血总结:30分钟掌握高通modem RFFE driver(射频驱动)配置方法(一)
- Hulu2022校招 | 笔试真题及解法揭秘
- php数组题目以及答案,PHP数组面试考题
- 工业制造中的大数据分析应用_工业大数据分析方案-美林数据
- 浅谈金融数据中心的消防安全
- ERP项目实施过程中的致命过失(转)
热门文章
- Cgroup 研究报告
- Android VNC Server
- 【译】What is a UTXO, and how does it work for a blockchain ledger?
- Android Zygote分析
- Android热更新方案Robust
- Android6.0 keyguard锁屏加载流程分析
- es创建索引库,无法使用InetSocketTransportAddress
- JZOJ 5794. 2018.08.10【2018提高组】模拟A组省选 旅行
- java 实体类arraylist_如何实现Java的ArrayList经典实体类
- telnet 22正常 ssh无法连接_Telnet咋就不安全了呢?带你来看用户名和密码