2020-03-28 Win10+Docker+VSCode+ReactNode.js配置

根据客户需求，要在离线环境开发部署基于React的应用。由于：

决定采用Docker，在联网环境下配置React后携带入开发环境。

家里是Win10环境，半年前已经安装了Docker。
Docker在Win10上的安装可以参考官网解决方案 Docker Desktop for Windows 。
（然而其实质。。。就是装了一个VirtualBox里安装的Linux虚拟机，在里面装Docker。）
常规解决方案：
Docker官网
Docker Desktop for Mac
Docker Desktop for Windows
Win7/8可能需要更多 *** 作： Windows Docker 安装-菜鸟教程
这部分坑是最多的，可惜时间太久已经忘记了。

检查Docker版本：

配置Docker镜像：
由于众所周知的原因，需要配置镜像加速。
系统右下角 Docker 图标内右键菜单 Settings，窗口里Daemon标签页内配置json：

使用Node官方镜像为基础搭建

查看 node官方镜像

或

拉取最新版本的node镜像：

查看本地镜像：

运行容器：

进入容器并查看node和npm版本

另外，（由于众所周知的原因，需要配置镜像加速） 2
使用cnpm或给npm配置淘宝镜像：

来到了常见的create-react-app环节

启动应用：

成功运行应用，然而在浏览器里并不能看到。容器的端口并没有和主机绑定。
查看运行中容器状态：

查看容器端口绑定

保存一下镜像并创建容器绑定端口：

重新开启应用：

VSCode是真的香。。。

我用的第一个。

能看到当前镜像和容器。容器上右键可以Attach Visual Studio Code。
然后容器就停了。。。。
docker容器运行必须有一个前台进程， 如果没有前台进程执行，容器认为空闲，就会自行退出。Attach Visual Studio Code使用的是attach命令，就是使用现有终端，如果你要退出容器 *** 作，那么bash结束，容器也就退出了。

重新创建容器，加了持续运行进程。

vscode使用taskjson来配置项目的构建过程。
打开命令面板(Ctrl+Shift+P)选择Run Build Task(Ctrl+Shift+B)
如果当前工作空间没有taskjson配置文件此时会出现提示
选择 Configure Task Runner 自动创建taskjson。该配置文件在工作空间的vscode目录下，这个目录也是存放vscode配置的文件夹。
vscode默认的task配置文件中给出了执行tsc 和 gulp模板配置。简单介绍一下taskjson的写法
{
"version": "010",
// 要使用的命令或者可执行文件的路径
"command": "tsc",
// 对应command参数，是否是一个命令，否则为执行文件路径
"isShellCommand": true,
// 是否在执行task任务时显示控制台窗口
"showOutput": "always",
// 对应command参数指定程序的参数
"args": ["-p", "src", "--allowJs", "-w"],
// 不太明白这个，基本用不到
"problemMatcher": "$tsc",
}
另外还有更多参数和用法可以参照下面的官方文档
>