Rumah alat pembangunan VSCode vscode如何编写和使用flutter应用

vscode如何编写和使用flutter应用

Jun 09, 2020 pm 02:20 PM
vscode

vscode如何编写和使用flutter应用

vscode编写和使用flutter应用的方法是:

1、配置插件

需要在vscode中下载插件

ac76ee3b1afd36ca4d143f155f90008.png

e8b7f8f93423f603c3d4dd5ce7f720e.png

找到这两个插件下载好并重新加载vscode就可以了。

2、运行

flutter项目的运行命令是 flutter run
但是flutter和react-native不同的是,flutter run之后会检测是否连接设备,如果没有已连接的设备会不往下运行。
你可以通 flutter devices, 当然你配置了android的环境的话,也可以用dab命令, adb devices。

在项目运行起来后,在下方的终端会有一些输出信息,编译耗时、打debug包、安装等。
还有有一些提示信息

21c8138335c1b52e6666beea74dce45.png

当你需要热加载的时候按 r,需要重启应用按R。
所以当我们每一次写好代码保存后,只要再按一下r,就可以看到最新的效果,而且flutter的热加载比rn的更快。

3、写第一个flutter应用

按照flutter中文网(https://flutterchina.club/get-started/codelab/
写我们第一个flutter应用。
其中我个人碰到一个问题。
就是在第2步、使用外部package中,

f4860577e679ecb62c300595cd226a7.png

在pubspec.yaml文件中申明了插件依赖,保存之后自动下载了,然后在main.dart文件中引用该插件,发现没有自动补全提示,我手写全部路径,提示找不到。
然后重新打开vscode才好,应该是vscode对这个以来的读取问题。

然后是接着照着中文的代码写。flutter的也有state,据说是根据react中的state来的想法加入的。

个人体会

flutter项目比rn流畅,编译快,热加载快,应用运行也更流畅,但dart语法是真蛋疼

fluuter中文网写的文档感觉也不是很友好,很多关键的东西写的不够具体、甚至没写。
没有对state这个做解释、没有state的使用说明,然后那个路由也是。

推荐教程: 《vscode入门教程

Atas ialah kandungan terperinci vscode如何编写和使用flutter应用. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Cara memasang vscode pada tingkap Cara memasang vscode pada tingkap Jul 27, 2025 am 03:16 AM

GotoHttps: //code.visualstudio.comAndWownloadTheWindowSUserInstaller.2.runthe.Exefile,AlloWChanges.andSelectReCommendedOptionsonCludingAddingTopArdCreatAdesKtopShortcut.3.ClickFinShoShB

Cara menjalankan skrip python dengan argumen di vscode Cara menjalankan skrip python dengan argumen di vscode Jul 30, 2025 am 04:11 AM

TorunaPythonscriptwithargumentsinVSCode,configurelaunch.jsonbyopeningtheRunandDebugpanel,creatingoreditingthelaunch.jsonfile,andaddingthedesiredargumentsinthe"args"arraywithintheconfiguration.2.InyourPythonscript,useargparseorsys.argvtoacce

Cara Menggunakan VSCode dengan WSL (Subsistem Windows untuk Linux) Cara Menggunakan VSCode dengan WSL (Subsistem Windows untuk Linux) Aug 01, 2025 am 06:26 AM

Installwslandalinuxdistribusionbyrunningwsl-installinpowershellasadministrator, thenrestartandsetupthelinuxdistribusi.2Stallthe "extensioniNvscodetoenableIntrationWithwsl.3.openapojamslbywslbymslymslymslymslymslymslymslymslymslymslymslymslymslymsly

Bagaimana cara menukar saiz fon dalam vscode? Bagaimana cara menukar saiz fon dalam vscode? Aug 02, 2025 am 02:37 AM

Tochangethefontsizeinvscode, useoneofthesemethods: 1.opensettingsviactrl, (orcmd, onmac), carian "fontsize", dan lustthe "editor: fontsize" value.2.opensettings (json)

Cara menukar saiz fon di vscode Cara menukar saiz fon di vscode Jul 26, 2025 am 04:13 AM

Tochangethefontsizeinvscode, gotofile> preferences> tetapan, carian untuk "fontsize", danmodifyThe "editor: fontsize" value.2.alternative, manualedithesettings.jsonfilebyopeningthecommandpalette, memilih "Preference: Opensetti

Apakah perbezaan antara vscode dan visual studio Apakah perbezaan antara vscode dan visual studio Jul 30, 2025 am 02:38 AM

Vscodeisalis, cross-platformcodeeditorwithide-likefeaturesviaextensions, idealforwebandopen-sourcevelopment; 2.visualstudioisafull-capeured, windows-onlyesignedforcomplex.net, c, andenterprisplications;

Cara Debug Ujian Unit Di VSCOD Cara Debug Ujian Unit Di VSCOD Aug 01, 2025 am 06:12 AM

CreateOrmodifyLaunch.jsoninvscodebyopeningtherunanddebugview, SelectingYourenVironment (mis., Python, node.js), danConfiguringitfo RyourtestFramework (mis., Pytest, jest) .2.SetBreakPointSinyourtestFile, SelectthedebugConfiguration, andStartDebuggingWithf5topaus

Cara menggunakan pratonton markdown di vscode Cara menggunakan pratonton markdown di vscode Jul 29, 2025 am 02:05 AM

Untuk menggunakan pratonton markdown dalam vscode, tiada pemasangan tambahan diperlukan. 1. Buka atau buat fail .md; 2. Gunakan kekunci pintasan CTRL Shift V (Windows/Linux) atau CMD Shift V (Mac), atau buka pratonton melalui menu klik kanan dan panel arahan; 3. Pratonton dikemas kini secara real time secara lalai, memastikan bahawa simpan automatik didayakan untuk terus disegerakkan; 4. Anda boleh menukar fungsi pemotongan penyegerakan dengan mengklik kanan kawasan pratonton, dan pratonton menyokong markdown gaya Github dan formula matematik (lanjutan markdownallinone perlu dipasang), dan boleh menyesuaikan gaya CSS, yang mudah dioperasikan dan lengkap.

See all articles