当前位置: 首页 > 后端技术 > Node.js

基于docker搭建前端环境

时间:2023-04-03 22:57:26 Node.js

前言又是一年的毕业季,不忍心看到一个大学生苦苦搭建节点环境,却无法享受开发的乐趣。我特地写这篇文章。之前有过一篇文章,使用Docker快速配置前端开发环境但不同的是,这篇文章会以一步一步的形式帮助安装程序完成一次构建,到处复制:)这篇文章旨在摆脱搭建开发环境的重复性工作,以及保持开发的一致性,有些观点并不完全正确,因此本文不适合学习docker。适合在公司装机器的人吐槽。现在只能吐一次。我厌倦了总是被小学女生包围。现在你可以在机器造好后,扔过去,你可以告诉他们滚。在DOCKER_ENV中搭建基础环境,保存HOST持久化Items,让DOCKER_ENV读取Items。通过DOCKER_ENV和HOST之间的网络连接为systemWin10或者MacdockerDockerCEterminalgui-toolKitematic做准备,Win10以下不推荐使用,VirtualBox会卡死!DockerCE下载地址:https://www.docker.com/commun...Kitematic下载地址:https://github.com/docker/kit...1.Build在安装DockerCE之前,基础环境DOCKER_ENV,如果你是Win的同学,记得先开启Hyper-V,这需要他的支持。安装好后,进入设置,改源,里面提供了一个http://af9c260a.m.daocloud.io拉系统镜像,Brainlesscentos。dockerpulldaocloud.io/centos:7//下载centos7确认dockerimages中是否存在该镜像,然后可以输入命令加载镜像并运行。尽量不要使用gui工具,因为会有一些奇怪的错误。比如这一步,他有一个验证不识别三方图片,导致加载失败。dockerrun-i-t--namem-centosdaocloud.io/centos:7/bin/bash//从centos开始,可以打开Kitematic体验刚才一个容器就可以启动环境了。用什么,一路yuminstall就可以了。我需要节点npm来发送curl-sLhttps://rpm.nodesource.com/setup_7.x|bash-yuminstall-ynodejs完成后,您可以保存对镜像的更改,其中7ca87是您的容器ID,可以直接在GUI工具中查看。dockersavem-node-oD:\docker\m-node.tar//保存到这一步的所有信息,环境搭建完成。可以双击打开该文件,确认是否可以打开。save可以保存meta信息,文件会稍微大一点。如果你觉得它太大了,你可以自己tar。bz2压缩,我的压缩是90MB2.Items由于项目文件原来存在于HOST的某个文件夹中,所以需要挂载到第一步搭建的执行环境中。注意:如果这一步报错提示没有共享,那么进入docker的setting,打开dockerimportD:\docker\m-node.tarm-node//从docker文件中加载镜像run-it--namem-node-v/datam-node/bin/bash//镜像容器并挂载数据没有指定挂载目标,所以这里需要指定。我使用了图形用户界面。嗯,我还是可以通过选择爽最后得到的m-node进行一些操作,比如我可以去/data/执行npminstall|npmrundev这里m-items的镜像其实是可以通过commit获取的,不过为了避免概念太多就不多解释了。3、网络连接因为环境本质上是在上一步m-node中,所以HOST需要能够访问到,或者使用GUI工具点击鼠标完成。嗯,终于到这里了。尝试打开Dreamweaver修改文件,然后访问localhost,484很棒~还有一个小坑,webpack-dev-middlewave不会检测到文件变化,暂时poll了一下解决,先用它因为第一步已经搭建好了环境,所以下载镜像文件后,小伙伴执行第二步和第三步就可以使用了。另外,为了方便,大家可以尝试把常用的命令写成脚本。像我一样,只要npmruncomd就可以开始搬砖了。"comd":"dockerexec-itm-combination/bin/bash-c\"cd/data&&npmrundev\""总结官网说的,同样需要保持内部开发环境一致团队。然而,你们中的一些人是痛苦的......如果你想像java和php这样玩,那是类似的。照例行事就行了。嗯,好像有个猫王……为了省事,很多操作都是用GUI来完成的,现在还需要做的就是把这些操作写回command中,方便点……