开发环境/开发工具

VSCode操作栏顶栏-配置运行模式常用一浏览器运行常用二nodejs运行顶栏-运行调试模式运行非调试模式运行侧栏在文件夹中查找底栏设置setting总体结构设置命令行光标收起所有文件代码片段React{ React Function Component: { prefix: react, body: [ import React from react;, , export default function() {, return (, div, $0, /div, );, }, , ], description: React Function Component } }Vue{ Vue Base Component: { prefix: vue, body: [ template\n, /template, , script setup langts\n, /script, , style scoped langscss\n, /style ], description: Vue Base Component } }插件Chinese (Simplified)简体中文插件Live Server开启服务器代理HTML文件Markdown Preview Enhancedmarkdown编辑器VolarTS和JS版本TypeScript Vue Plugin (Volar)Vue Language Features (Volar)使用JS编写Vue时要及时关闭TS版本的Volar并重新加载配置文件一jsconfig.json{ compilerOptions: { target: esnext, useDefineForClassFields: true, module: esnext, moduleResolution: node, strict: true, jsx: preserve, sourceMap: true, resolveJsonModule: true, isolatedModules: true, esModuleInterop: true, lib: [esnext, dom], skipLibCheck: true, baseUrl: ., paths: { /*: [src/*] } }, include: [src/**/*.js, src/**/*.jsx, src/**/*.vue], references: [{ path: ./tsconfig.node.json }] }配置文件二tsconfig.json{ compilerOptions:{ //ES版本ES5,ES2015(ES6),...,ES2021,...,ESNext(最新版本的术语) target: ESNext, //ES6之前的非标准模块化方案CommonJS、AMD、UMD //ES6推出import模块化规范 //ES9推出动态import module: ESNext, moduleResolution: Node, //模块查找策略 allowSyntheticDefaultImports: true , //支持import的默认导入导出 lib: [ES2020,dom,dom.iterable], //ts文件中支持的库 //baseUrl是paths[别名]的前缀 baseUrl: ./, paths: { /*: [src/*] }, outDir: 路径, //编译文件输出目录 removeComments: true, //移除注释 sourceMap: true, //生成sourceMap文件 noImplicitAny: true, //不允许隐式声明变量 preserveConstEnums: true, //枚举常量依旧以常量的形式存在 composite: true //用了可以优化性能 } include: [路径1,路径2...], //编译的哪些ts文件 references: [] //引入其他tsconfig.json文件 } src/**/*/*表示任意文件/**表示任意目录vite-env.d.ts//处理typescript编译器无法识别.vue文件的问题 declare module *.vue { import { DefineComponent } from vue const component: DefineComponent{}, {}, any export default component }gitlen每行代码的具体作者和修改时间分支对比快捷键CtrlP显示所有编辑器Ctrl Shift P显示所有命令、同时可以根据文件名搜索文件tab作用1向前移动一个制表符tab作用2代码片段自动补全时移动到下一个自主定义处shift tab向后移动一个制表符命令行powershell禁止运行脚本使用Set-ExecutionPolicy RemoteSigned或者Set-ExecutionPolicy Unrestricted浏览器运行JS代码页面的JS代码组成源代码的片段、内容脚本页面HTML中的脚本控制台的代码三种JS代码作用域范围相同日志打印位置控制台控制台JS代码多条语句用;分隔会打印最后一个表达式的值源代码的片段会打印最后一个表达式的值源代码页面当前页面的代码能打断点进行调试片段自主编写JS脚本能操作当前页面的DOM元素内容脚本插件脚本能操作所有页面的DOM元素元素选择DOM元素修改CSS样式使用浏览器取色器移动模式和PC模式互换控制台查看各种级别的打印输出应用程序查看LocalStorage仓库、SessionStorage仓库、Cookie仓库、IndexedDB非关系数据库网络浏览器自带的抓包工具查看网络请求的请求头请求体响应头响应体录制录制内容1鼠标事件、键盘事件、触屏板事件录制内容2路由跳转的录制录制本质通过js脚本实现操作复现快捷键ctrlf关键字搜索ctrlh历史记录页ctrlj下载内容页ctrlshifts截图ctrlshiftb显示或隐藏书签页F12开发者工具F11开启或关闭全屏模式F5页面刷新有链接的文字可以通过右键复制其链接设置开发者工具位置把控制台放到下左右或者单独开一个窗口常用插件WebTab-AI新标签页Vue.js devtoolsReact Developer ToolsPostWoman Http接口调试插件FeHelper(前端助手)VS Installer安装VS Community采用默认安装位置VS InstallerC:\Program Files (x86)\Microsoft Visual Studio\Installervs编辑器按 0/ins 键切换光标形状VMware workstation 16安装VMware问题一安装时不输入密匙接下来的操作会遇到下面情况解决方案将VMware workstation卸载重新安装时输入密匙密匙有可以自己查阅虚拟机属性配置虚拟网络所需镜像下载windows镜像前往windows官网centos镜像前往centos官网ubuntu镜像前往ubuntu官网DBeaver运行SQL脚本问题一public key retrieval is not allowedsnipasteF1截图截图完成后可以贴图、保存、标注鼠标滚动可以放大或缩小贴图Ctrl鼠标滚动可以增减贴图的透明度Android Studio安装位置默认位置C:\Program Files\Android\Android Studioandroid sdk默认位置C:\Users\Administrator\AppData\Local\Android\Sdkgradle user home位置位置C:\Users\Administrator\.gradle作用1存储gradle wrapper安装的各版本gradle环境变量ANDROID_HOMEC:\Users\Administrator\AppData\Local\Android\SdkJAVA_HOMEC:\Program Files\Android\Android Studio\jbrPath%ANDROID_HOME%\toolsPath%ANDROID_HOME%\platform-toolsPath%JAVA_HOME%\binPath%GRADLE_HOME%\bin安装模拟器打包App模拟器网络10.0.2.2是网关IP同样也是本地计算机在模拟器网络中的IP模拟器的DNS要与本地计算机连接wift的DNS保持一致才能正常进行域名解析调试app上的WebViewnvmnpmnode联系nvm管理多个nodejs一个node版本对应一个npmC:\Users\Administrator\.npmrc是npm的全局配置文件.\npmrc中可以配置全局安装库目录、第三方库镜像nvm的功能下载指定版本的nodejs切换nodejs版本配置nvm配置环境变量NVM_HOME为D:\proSofts\nvm配置环境变量Path为D:\proSofts\nvmnvm指令在D:\proSofts\nvm目录下配置环境变量NVM_SYMLINK为D:\proSofts\nvm\nodejsNVM_SYMLINK是当前版本nodejs的软链接配置环境变量Path为D:\proSofts\nvm\nodejsnode指令在软链接D:\proSofts\nvm\nodejs下nvm指令会读取配置文件%NVM_HOME%\setting.txt的root把nodejs安装到root目录下由于win10实现nodejs切换需要用到root\elevate.cmd并且elevate.cmd默认在%NVM_HOME%目录下所以root的值通常等于%NVM_HOME%nvm配置文件root: D:\proSofts\nvmarch: 64node_mirror: http://npmmirror.com/mirrors/node/nvm的使用nvm list availablewin10 能下载的远程nodejs版本nvm ls-remoteUbuntu能下载的远程nodejs版本nvm list已下载的node版本nvm current当前node版本nvm use 版本号切换到指定版本nvm install 版本号下载指定版本nvm uninstall 版本号卸载指定版本npm全局配置文件prefixD:\proSofts\nvm\npm_global npm全局安装目录cacheD:\proSofts\nvm\npm_cache npm缓存目录registryhttp://registry.npmmirror.com/ npm镜像(优先级高)pythonD:\proSofts\python\3查看npm全局配置文件npm confg ls查看npm全局安装目录npm config get prefix设置npm全局安装目录npm config set prefix 目录地址查看npm镜像npm config get registry设置npm镜像npm config set registry 镜像地址npm的使用package.json配置文件npm init -y初始化项目生成配置文件npm ls当前目录的第三方库npm ls -g全局安装的第三方库npm search 包名搜索远程包npm view 包名 versions搜索远程包的所有版本npm i 包名版本号下载指定版本号第三方库到当前目录npm i 包名 -g下载第三方库到全局目录npm i 包名 --force强制安装npm i 包名 --legacy-peer-deps支持安装同一库的多个版本npm login --registry xxx登录远程npm库npm publish把当前库发包到远程库package.json中的包名、主文件夹的名称尽量不要用中文node12.0之前的加密库是OpenSSLnode12.0之后的加密库是BoringSSL清理缓存npm cache clean --force || 删除D:\proSofts\nvm\npm_cache删除package-lock.jsonnpx的使用npx 命令t 参数命令t 参数npx 在当前目录的node_module中寻找命令t找到命令t使用命令t没找到命令t下载并使用命令t命令t使用完成删除命令t其他Cli指令pnpmpnpm create vite搭建vue、react、electron脚手架pnpm初始化和运行的项目一旦移动位置就很容易报错配置文件package.jsoncnpmyarn包管理工具指令配置文件package.jsonwebpackvite打包工具指令配置文件webpack.config.js配置文件vite.config.jsnodemonnodemon xxx.js配置文件nodemon.jsonts-nodets-node xxx.ts默认支持CommonJS模块化typescripttsc --init初始化项目生成配置文件配置文件tsconfig.jsonpackage.jsonname项目名称version项目版本号description项目描述author项目作者main入口文件路径默认是index.jstype模块化方案默认是CommonJSscripts脚本命令devpendencies生成环境依赖devDependecies开发环境依赖package-lock.json锁定依赖版本package-lock.json 文件会精确地记录项目依赖模块的版本以确保在不同的开发环境中安装相同的模块版本从而避免不同环境下可能出现的版本差异导致的问题。加快安装速度npm 在通过 package-lock.json 安装依赖时会利用缓存机制从本地缓存中快速安装相应的模块从而提高安装速度。提供依赖完整性保证package-lock.json 文件会记录每个模块的完整依赖关系树保证每个模块的依赖都可以被满足并安装成功。nrm全称npm registry manager用于npm镜像源间的切换。Maven概述安装maven手动安装到自定义位置(推荐)maven wrapper强制下载到C盘固定位置配置环境变量M2_HOMED:\proSofts\mavenpath%M2_HOME%\bin查找依赖的顺序%M2_HOME%/conf/setting.xml指定的本地maven仓库%M2_HOME%/conf/setting.xml指定的远程镜像仓库远程maven中心仓库从远程库下载的依赖会存放到本地maven仓库项目结构targetclassessrcmainjavaresourcestestjavapom.xml功能安装第三方依赖编译Java项目文件运行Java项目全局配置文件%M2_HOME%\conf\settings.xml ?xml version1.0 encodingUTF-8? settings xmlnshttp://maven.apache.org/SETTINGS/1.2.0 xmlns:xsihttp://www.w3.org/2001/XMLSchema-instance xsi:schemaLocationhttp://maven.apache.org/SETTINGS/1.2.0 https://maven.apache.org/xsd/settings-1.2.0.xsd //设置localRepository本地仓库 localRepositoryD:/proSofts/maven/repository/localRepository //设置镜像地址 mirrors mirror idaliyun-maven-public/id urlhttps://maven.aliyun.com/repository/public/url mirrorOfcentral/mirrorOf /mirror mirror idaliyun-maven-center/id urlhttps://maven.aliyun.com/repository/central/url mirrorOfcentral/mirrorOf /mirror /mirrors ........... /settingsmvn的使用mvn clean删除target文件夹mvn compile编译src/main中的Java类并把class字节码放到target中mvn dependency:resolve下载pom文件中的第三方依赖mvn exec:java运行pom文件指定的入口类mvn test运行src/test/java中的所有测试文件mvn test -Dtest类A#方法A运行src/test/java中类A的方法Apom.xml文件?xml version1.0 encodingUTF-8? project xmlnshttp://maven.apache.org/POM/4.0.0 xmlns:xsihttp://www.w3.org/2001/XMLSchema-instance xsi:schemaLocationhttp://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd modelVersion4.0.0/modelVersion groupIdcom.example/groupId artifactIdmy-project/artifactId version1.0.0/version dependencies .... /dependencies build plugins plugin groupIdorg.codehaus.mojo/groupId artifactIdexec-maven-plugin/artifactId version1.6.0/version configuration mainClass运行的主类/mainClass /configuration /plugin /plugins /build /projectPythonwindows采用驱动程序安装pythonPath通常有当前目录、系统变量PYTHONPATH、sys.pathsys.path通常有%pythonHome%、%pythonHome%/Lib、%pythonHome%/Lib/site-packagespip下载路径%pythonHome%/Lib/site-packages移动或修改%pythonHome%文件夹很可能导致pip.exe找不到python.exeUbuntuapt install python2apt install python3EXCEL多列复制到一列合并至一行方式一TEXTJOIN(分隔符,是否避免多余空行,单元格A:单元格B)。方式二单元格A单元格B单元格C去公式复制后右键选择“值粘贴”单元格内部换行点击开始页签中的自动换行