【web系列一】 开发环境配置

目录

google chrome浏览器

离线包下载

页面不随代码实时更新

pycharm

anaconda3+pycharm->django

anaconda3及pycharm的配置方法如下

django

notepad++

html

自动补全标签功能

vue3

node.js

vue3的devtools

vscode

插件下载地址

html插件

css插件

vue插件

通用插件

anaconda+vscode->django

配置django环境

插件

激活环境


google chrome浏览器

离线包下载

Google Chrome v103.0.5060.53 正式版 离线安装包 - 果核剥壳 (ghxi.com)

谷歌浏览器 Chrome 最新版离线安装包下载地址 v103.0.5060.53 - 每日自动更新 | 异次元软件 (iplaysoft.com)

页面不随代码实时更新

f12进入开发者页面,点击settings,找到network->激活disable cache

pycharm

anaconda3+pycharm->django

anaconda3及pycharm的配置方法如下

Anaconda及pytorch详细安装及使用教程_Nicholson的博客-CSDN博客_anaconda+pytorchAnaconda及pytorch详细安装及使用教程_Nicholson的博客-CSDN博客_anaconda+pytorchAnaconda及pytorch详细安装及使用教程_Nicholson的博客-CSDN博客_anaconda+pytorch

django

//打开anaconda prompt
//创建conda环境
conda create -n web python=3.7
//激活环境
activate web
//安装django
pip install django==3.2.12
//然后在pycharm中新建工程并切换到web环境即可

notepad++

html

自动补全标签功能

        设置->首选项->自动完成->勾选html/xml结束标签

vue3

node.js

下载 | Node.js 中文网 (nodejs.cn)

vue3 devtools

Vue Devtools_6.1.4_chrome扩展插件下载_极简插件 (zzzmh.cn)

vscode

插件下载地址

Extensions for Visual Studio family of products | Visual Studio Marketplace

 VsixHub - Best Extensions for VS Code

html插件

插件名功能快捷键
open-in-browser在浏览器中打开htmlctrl+alt+o
Prettier格式化shift+alt+f
Live-server自动刷新网页

go live启动服务

port:xxx关闭服务

css插件

插件名功能快捷键
html css 在浏览器中打开htmlctrl+alt+o

vue插件

插件名功能
vue 3 snippets代码提示
vue language features(volar)代码颜色渲染

通用插件

插件名功能快捷键
beautifyjs\css\html格式化F1->beautify->js/css/html

anaconda+vscode->django

配置django环境

        完全参考上文第一部分anaconda3+pycharm->django即可。

插件

插件名功能
python支持Python语法和切换环境
Python Environment Manager支持使用conda命令
django支持django语法识别和模板补全

激活环境

  1. ctrl+shift+p->Python:Select Interpreter->选择第一步在anaconda中配置好的环境
  2. 直接运行调试,无法配置端口:run and debug->python->django即可
  3. 使用launch.json运行,可以配置端口:run and debug->create a launch.json file->python->django->添加url:端口号
{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Python: Django",
            "type": "python",
            "request": "launch",
            "program": "${workspaceFolder}\\manage.py",
            "args": [
                "runserver", "127.0.0.1:8010"           // url:port
            ],
            "django": true,
            "justMyCode": true
        }
    ]
}

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值