• 技术文章 >开发工具 >VSCode

    vscode如何编写和使用flutter应用

    hzchzc2020-07-02 14:36:03原创2739

    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入门教程

    以上就是vscode如何编写和使用flutter应用的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:VSCode
    上一篇:VSCode 怎么将 ES6 转 ES5? 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • vscode的插件放在哪里• vscode如何做注释• 如何让vscode右键项目文件夹打开• 解决vscode无法使用ng命令的问题
    1/1

    PHP中文网