配置VScode上基于WSL的lc3汇编语言环境

博客内容说明

我的博客主站是基于notion的，这是我的notion主页。因为notion的markdown格式和csdn不兼容，所以别的文章内容可能会缺图和排版错误，请谅解。
所有文章我都会贴上notion的原链接，加载可能会慢些。但notion确实是一个好用的写作+效率工具，而且界面排版方便美观，推荐大家使用。
这篇原文的链接在这个notion页面中，有更好的排版和图片，后续更新也会在里面，推荐前往浏览。

0. 为什么要配置wsl上的lc3环境？

---

0.1 看不惯学校给的vm

我是计算机系的，上ECE课的时候用到了《计算机系统概论》这本书。有关于lc3汇编语言的作业。

老师建议用学校封装好的linux，放在vm上跑，但我感觉vm太慢而且操作不友好。笔记本也因为内存不够的问题总是卡死，文件交互也不方便，不能直接复制帮别人检查文件。好在windows出了linux子系统（wsl），想着自己配置一个wsl的lc3环境，能省不少事。

因为之前就已经在用Ubuntu子系统学linux的操作了，索性就搜了资料配置了一个环境出来。现在配置的差不多了，但是课也快上完了。算是总结一下经验，为学弟学妹们排雷了。

0.2 wsl上写lc3的利弊

?利/advantage

---

• 可以用vscode或别的win端的编辑器敲代码，**代码高亮，快速文本编辑，**代码书写体验极佳。
• 文件交互方便，通过资源管理器直接访问wsl文件系统，复制粘贴一键搞定
• vscode还能配置调试任务（tasks）
  一键调试代码，配置一劳永逸
• 不用费脑子折腾万恶的vm

?弊/disadvantage

---

• 需要一定的linux使用基础
• 配置环境需要小折腾
• 可能会有莫名的bug?
• win和linux文件系统不兼容，不注意会有换行符的问题（都用vscode就没事，见后文）

因为我也是从小白开始学起，很多都是参考别人的博客和教程，所以这里就不重复造轮子了，一些配置步骤就直接引用（转载）别人的文章了。

我的配置：
系统：win10 1903
电脑：surface pro（第五代）

• mac本身就是Unix，用terminal就行
• win7因为没有Linux子系统，所以不适用本文方法，乖乖用vm跑

1. 安装windows的linux子系统（WSL）

---

1.1 从零开始安装wsl

1. 快捷键 win + i 打开系统设置，更新win10到最新版本
2. win键 打开开始菜单，键盘直接输入 功能 会出现搜索界面，点击 启用或关闭windows功能
3. 在弹出来的窗口的最下方，将 适用于Linux的windows子系统 打勾
4. 在应用商店中搜索linux，会跳出来很多可选的子系统。随个人喜好选择，我用的是 Ubuntu18.04
5. 等待子系统安装好之后，打开应用，第一次初始化会挺久的，大概五分钟。
   初始化期间不要关掉窗口 ，不然会有奇奇怪怪的问题。初始化完了会让你输入用户名和密码，确认之后就可以正常使用了。
6. 现在wsl就装好了，这是一个区别与win系统的相对独立的操作系统。目前只有命令行界面，但之后会讲到图形界面。可以输入 mkdir test 来创建一个名为test的文件夹，也可以输入 uname -a 来查看系统信息。（linux的命令行操作可以上网自己学。）

1.2 wsl的一些使用技巧

• wsl的目录可以在win的资源管理器下直接访问，路径一般是 C:\Users\YOUR_USERNAME\AppData\Local\Packages\CanonicalGroupLimited.UbuntuonWindows_79rhkp1fndgsc\LocalState\rootfs 可以直接从里面复制文件出来。但是把外面的文件复制进去会不能识别，最好在命令行中用cp命令（因为文件系统不同，linux不能识别win的文件）
• wsl命令行也可以通过在cmd或者powershell中输入 bash 来开启

2. 安装vscode和插件

---

2.1 安装vscode

进入vscode官网，下载最新版本的vscode，安装

2.2 安装插件

1. 打开vscode，左边栏第5个点进去
2. 在最上方搜索栏输入 Chinese 安装搜索结果中的第一个，作者为Mircosoft的插件。
3. 在最上方搜索栏输入 remote - WSL 安装搜索结果中的第一个，作者为Mircosoft的插件。
4. 在最上方搜索栏输入 LC3 Assembly 安装搜索结果中作者为PaperFanz的插件。

3. 安装lc3编译器

---

3.1 更换镜像源

因为wsl的ubuntu发行版真的太干净了，很多正常发行版有的软件他都没有，所以需要手动把编译lc3编译器的工具装上。鉴于国内访问外往速度感人，我们先把镜像源换成阿里云镜像。

熟悉linux操作的直接进入/etc/apt/文件夹，把当前source.list备份成source.list.backup，再用vim或nano将下面的内容覆盖原文件

看不懂上面一句的，打开资源管理器，进入C:\Users\YOUR_USERNAME\AppData\Local\Packages\CanonicalGroupLimited.UbuntuonWindows_79rhkp1fndgsc\LocalState\rootfs\etc\apt （用你的用户名代替YOUR_USERNAME）用vscode打开 source.list 文件，注释当前全部内容（ ctrl + A , ctrl + /），再把下面的内容复制进去，保存。

    # 阿里源
    deb http://mirrors.aliyun.com/ubuntu/ bionic main restricted universe multiverse
    deb-src http://mirrors.aliyun.com/ubuntu/ bionic main restricted universe multiverse
    
    deb http://mirrors.aliyun.com/ubuntu/ bionic-security main restricted universe multiverse
    deb-src http://mirrors.aliyun.com/ubuntu/ bionic-security main restricted universe multiverse
    
    deb http://mirrors.aliyun.com/ubuntu/ bionic-updates main restricted universe multiverse
    deb-src http://mirrors.aliyun.com/ubuntu/ bionic-updates main restricted universe multiverse
    
    deb http://mirrors.aliyun.com/ubuntu/ bionic-proposed main restricted universe multiverse
    deb-src http://mirrors.aliyun.com/ubuntu/ bionic-proposed main restricted universe multiverse
    
    deb http://mirrors.aliyun.com/ubuntu/ bionic-backports main restricted universe multiverse
    deb-src http://mirrors.aliyun.com/ubuntu/ bionic-backports main restricted universe multiverse

进入命令行，输入下面这行命令就能更新镜像源，获得速度加成了。

sudo apt-get update

3.2 安装组件

linux安装软件很方便，只需要一行命令，这里我们安装wish gcc flex unzip wget这5个软件。打开命令行，输入

    sudo apt-get install wish gcc flex unzip wget

输入密码再确认就可以了。

亲测换成阿里源速度基本是原来的10倍（网好的话可能是100倍）。

3.3 安装lc3编译器

具体安装就参照这一篇文章吧，写的很详细

补充一下：

• 强烈建议查看?官网的说明文档，有详细的使用说明，可以解决很多问题
• 下载及解压两个源文件可以用以下命令

    # 下载lc3仿真器及编译工具
    wget http://highered.mheducation.com/sites/dl/free/0072467509/104652/lc3tools_v12.zip
    # 下载c语言转lc3汇编语言转换器工具
    wget http://highered.mheducation.com/sites/dl/free/0072467509/104652/lcc.zip
    # 解压压缩包
    unzip lc3tools_v12.zip
    unzip lcc.zip

4. 在vscode上远程打开WSL

---

4.1 现在尝试用vscode连接wsl

1. 打开vscode，如果你已经安装了 remote - WSL 的话，左下角会有 >< 符号，点击后在下拉栏选择 New Windows
2. 在弹出的新窗口中：打开vscode资源管理器（左侧栏第一个）→ 打开文件夹 → 在下拉栏中选择你要用来存放lc3相关文件的文件夹。成功打开之后，所有操作基本与编辑windows系统下的文件相同。

4.2 一些操作细节

• 文件的复制、移动、删除等操作可以子啊左侧资源管理器里，通过拖拽完成。delete是 永久删除 不能恢复。在windows资源管理器中（C:\Users\YOUR_USERNAME\AppData\Local\Packages\CanonicalGroupLimited.UbuntuonWindows_79rhkp1fndgsc\LocalState\rootfs）复制移动后，可能在wsl中不能识别而没有显示。
• linux系统和windows系统的换行符不同。简单来说就是
  • 在linux系统下，右下角一排中选择 LF
  • 在windows系统下，右下角一排中用 CRLF

5. 在vscode上写lc3汇编语言

---

1. 在远程wsl模式下的vscode中，打开 扩展（左侧栏四个小方形那个），把之前安装的三个插件 install in WSL

2. 打开vscode资源管理器，新建一个文件test.asm，注意以.asm扩展名结尾。

3. 打开这个文件，就能快乐的用vscode写lc3了。从此多行复制，代码片段，语法高亮，TODO tree都有了，而且启动嗖嗖的快，颜值唰唰滴高。vm有生灵倒悬之急，岂不美哉？

6. 在vscode上调试lc3程序【重点】❗

---

6.1 lc3的编译过程

想要调试lc3，首先要知道他是怎么工作的。这也是学习lc3的一部分。

你写的汇编伪代码会经过两轮pass，生成.sym和.obj文件。.obj文件（也就是机器码）再被lc3sim仿真器读取，由仿真器来模拟lc3执行代码的过程。

因此，一般而言，调试lc3汇编代码需要两行命令， lc3as test.asm 和 lc3sim test.obj 有时候需要打印输出还要 lc3sim -s testcommand > myoutfile 等等。可是这些重复的输入能不能简单一点呢？

当然可以，这里就用到了vscode的“tasks”功能，把重复的工作化简。

6.2 用tasks化简调试过程

你可以把vscode的tasks看作是一键执行预定脚本的功能。把调试命令设置好后，只需要一键就可以重复调用。具体操作如下

1. 若你没有改过快捷键绑定，在文本编辑界面 ctrl + shift + B 就会弹出配置任务（tasks）的下拉栏 → 配置任务 → Others。一个名为tasks.json的文件会创建在.vscode文件夹内，这是vscode放置当前工作区配置的文件夹，不要删去。
2. 在这个用下面的代码覆盖里面的内容，把注释的地方改成自己对应安装的。

        {
     
            // See https://go.microsoft.com/fwlink/?LinkId=733558
            // for the documentation about the tasks.json format
            "version": "2.0.0",
            "tasks": [
                {
     
                    "label": "lc3as asmble",              //之后调用时显示的名字
                    "type": "shell",
                    "command": "$HOME/bin/lc3as",       //改成你的lc3as的路径
                    "args": [
                        "${fileBasename}"               //command+args就是你给命令行的信号，这里相当于lc3as test.asm
                    ],
                    "options": {
     
                        "cwd": "${fileDirname}"
                    },
                    "presentation": {
     
                        "echo": true,
                        "reveal": "always",
                        "focus": false,
                        "panel": "shared",
                        "showReuseMessage": true,
                        "clear": false
                    },
                    "group": "build",
                    "problemMatcher": []
                },
                {
     
                    "label": "lc3sim simulate",
                    "type": "shell",
                    "command": "$HOME/bin/lc3sim",          //改成你的lc3sim的路径
                    "args": [
                        "${fileBasenameNoExtension}.obj"    //这里相当于lc3sim test.obj
                    ],
                    "options": {
     
                        "cwd": "${fileDirname}"
                    },
                    "presentation": {
     
                        "echo": true,
                        "reveal": "always",
                        "focus": true,
                        "panel": "shared",
                        "showReuseMessage": true,
                        "clear": true
                    },
                    "group": "build",
                    "problemMatcher": [],
                },
                {
     
                    "label": "lc3 CLI debug",                  //这个task用来整合上面两个tasks，能一键编译加调试
                    "type": "shell",
                    "dependsOrder": "sequence",
                    "dependsOn": [
                        "lc3as asmble",
                        "lc3sim simulate"
                    ],
                    "group": "build",
                    "problemMatcher": []
                }
            ]
        }

3. 这样一来，回到文本编辑的地方就可以通过按下ctrl + shift + B 来调用tasks啦。调用成功???

6.3 调试的注意事项

1. 建议先用lc3 asmble测试编译，到编译成功后再用lc3sim来调试。
   因为直接用lc3sim相当于连着使用了lc3 asmble和lc3 simulate两个tasks，这样lc3as的输出会一闪而过，如果编译没有成功的话，.obj文件没有更新，调试的仍是修改前代码对应的.obj文件。
2. 用lc3sim调试完了之后，记得用 quit 命令退出，不然下一次不会进入新文件的调试环境。
3. 有测试文件或输出要求的也可以实现，就是新建几个对应命令的tasks，再用类似lc3sim的task连接起来。
4. tasks文件的具体书写规则上?官方文档看吧（不愿意看英文的可以 换一个脑子 用chrome网页翻译代替）。用好了能有骚操作，对别的语言也是如此。
5. 不知道能不能用debug功能实现和lc3sim的对接，没有研究，要是可以的话就能F5一键调试了。但是断点好像不能传递给lc3sim。?反正我学完lc3了，以后都不用了，不折腾了。而且现在也挺方便。

7. 通过vscode可视化调试lc3程序【重点】❗❗

---

单单把命令行的调试界面整合到vscode中似乎还不够方便，用vm的同学一个 lc3sim-tk 的图形化界面就把黑底白字的命令行比下去了。那既然都是重复调用命令，能不能也用tasks来启动图形化的调试界面呢？

7.1 win10子系统的图形化界面

1. 具体的方法就参照这篇教程来就行了。推荐使用第二个方法，也就是xming方案。这样可以让弹出的窗口和win的窗口并列，沉浸式的debug体验极佳。

   Win10子系统安装图形化界面的两种方法

2. 总结一下这篇教程里的具体命令操作，方便以后回看

        #第一种方法（远程桌面）
        sudo apt-get update
        sudo apt-get install xorg xfce4 xrdp
        sudo sed -i 's/port=3389/port=3390/g' /etc/xrdp/xrdp.ini
        sudo echo xfce4-session >~/.xsession
        sudo service xrdp restart
        #win自带的远程桌面连接到127.0.0.1:3390，127.0.0.1是本地机器的回送ip地址。
        
        #第二种方法
        sudo apt-get update
        sudo apt-get install xorg xfce4 openssh-server
        #windows安装xming，启动xming
        DISPLAY:=0 lc3sim-tk    #跟着你要启动的图形化程序命令
        #就可以在win中弹出linux的图形化窗口了

3. 一些小技巧
   1. 进入xming launch可以选择不同的窗口显示方式。
   2. 进入~/.bashrc，添加 alias D='DISPLAY:=0' ，可以把DISPLAY:=0化简成“D”，以后就可以用 D lc3sim-tk 来启动了

7.2 用vscode启动图形化调试界面

原理还是一样，用tasks来代替重复输入命令。把下面的代码复制到tasks.json文件前几个tasks的后面，就可以了。

            {
     
                "label": "lc3sim-tk simulate",
                "type": "shell",
                "command": "DISPLAY=:0",
                "args": [
                    "/home/gavin/bin/lc3tools/lc3sim-tk",  //改成你的lc3sim-tk的路径
                    "${fileBasenameNoExtension}.obj"       //这里相当于DISPLAY:=0 lc3sim-tk test.obj
                ],
                "options": {
     
                    "cwd": "${fileDirname}"
                },
                "presentation": {
     
                    "echo": false,                         //因为是图形化界面，所以就不用显示命令行的输出了
                    "reveal": "never"
                }
                "group": "build",
                "problemMatcher": [],
            },
            {
     
                "label": "lc3 tk debug",                  //这个task用来整合上编译和图形化的界面，能一键编译加调试
                "type": "shell",
                "dependsOrder": "sequence",
                "dependsOn": [
                    "lc3as asmble",
                    "lc3sim-tk simulate"
                ],
                "group": "build",
                "problemMatcher": []
            }

至此，图形化就完成了，所有vm中的所有功能关于lc3都能在vscode中实现了。✨?✨?

---