目标:把flutter web项目部署到自己的服务器上,可以使用自己的服务器IP访问

前提:服务器已经安装了nginx,

这是我的flutter配置

edz@lwqdeMacBook-Pro ~ % flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.1, on Mac OS X 10.15.6 19G2021 darwin-x64,
locale zh-Hans-CN)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 3.5)
[✓] VS Code (version 1.54.1)
[✓] Connected device (1 available)

1.创建flutter web 和打包

$cd myfile      //到项目目录下
$flutter create myflutterwebappname //创建flutter web项目
$flutter run -d chrome // 运行项目到浏览器
$flutter web build // 打包
打包后,项目中xxx/build/web 文件中会有些文件,说明已经成功打包了,

2.上传打包文件到服务器,工具(Royal TSX: oopg)

1.打开工具,创建一个document,并再里面创建创建一个Terminal和File transfer(注意:创建时使用SFTP,端口默认22,)
2.使用自己的服务器ip和连接密码,在Terminal中连接服务器,启动nginx
3.File transfer 中把打包好的web目录下的文件上传到服务器的一个文件夹中,记下其中一个index.html路径,修改nginx的配置文件时要用

3.修改nginx的配置文件,

1.找到/etc/nginx/nginx.conf文件,把root 的路径改成 上面记下的index.html路径,
2.Terminal 中
$nginx -t //检查配置文件,(也可以用此方法找到nginx的配置文件路径)
$nginx -s reload //刷新nginx,就可以使用服务器ip访问了

我的nginx配置文件:

user  nginx;
worker_processes 1; error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid; events {
worker_connections 1024;
} http {
include /etc/nginx/mime.types;
default_type application/octet-stream; log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; sendfile on;
#tcp_nopush on; keepalive_timeout 65; #gzip on; include /etc/nginx/conf.d/*.conf; server {
listen 80 default_server;
server_name _; #root /lwq/ios/down;
root /lwq/flutterweb/testflutterweb; location / {
index index.html;
}
} }

Royal TSX界面:

FlutterWeb部署到服务器的更多相关文章

  1. Linux下部署FTP服务器

    Linux下部署FTP服务器 下载安装包 在这里介绍的是离线部署FTP,首先下载对应的rpm包,下载链接为: 下载vsftpd服务 下载FTP客户端 安装ftp服务器 关闭防火墙 service ip ...

  2. 部署openssh服务器

    1.安装服务器端软件包 先查看是否已经安装openSSH服务器软件包 # rpm -qa|grep openssh openssh-askpass-.3p1-.el6_6..x86_64 openss ...

  3. 将war包部署到服务器的详细步骤

    第一步: 先将项目打包成war文件,也就是将在项目上单击鼠标右键,选择Export: 选择WAR file,点击下一步: 会出现如下所示,选择你要保存的位置,点击完成: 在你所选择的地方会有个如下所示 ...

  4. 部署git服务器 gitServer 软件

    部署git服务器 gitServer 软件 搭建git服务器也并不是非常的难,有这么多优秀的软件,选择一个适合自己就行了 1. windows版本 http://gitstack.com/ 免费版本, ...

  5. Centos环境下部署游戏服务器-常用命令

         图1     在Linux的世界,如果你不玩命令,那你见了同行都不好意思和人家打招呼.同时服务器正常状况下放在远端,一般都是开ssh登录服务器,相信远程桌面的人很少见吧.这篇文章说说Linu ...

  6. Centos环境下部署游戏服务器-权限

    部署Web服务器的时候,在"DocumentRoot"指向的根目录新建一个文件夹,然后将网页和资源放在这个文件夹里,通过地址http://192.168.0.100/Res/ind ...

  7. debian7下部署nginx服务器

    笔者是在vmware中的Debian7下部署nginx服务器,采用离线部署方式.过程如下: 1.准备好需要的离线安装包 nginx-1.6.2.tar.gz,pcre-8.34.tar.gz,open ...

  8. Asp.Net 之 WebService部署到服务器后出现" The test form is only available for requests from the local machine "

    最近由于任务需要开发了一个WebService, 部署到服务器以后,出现上述问题,网上查找到如下解决方案: 问题原因: 从 NET Framework 1.1 起定义了一个名为 HttpPostLoc ...

  9. 单点登录CAS使用记(二):部署CAS服务器以及客户端

    CAS-Server下载地址:https://www.apereo.org/projects/cas/download-cas CAS-Client下载地址:http://developer.jasi ...

  10. 将网站部署到服务器上出现_STORAGE_WRITE_ERROR_问题

    用的thinkphp3.2的框架,在本地运行没有问题,部署到服务器上(基于centos的LAMP环境)即报错,报错信息如下(完全看不懂...):求大神帮帮忙~~~~(>_<)~~~~ :( ...

随机推荐

  1. linux CentOS 7上安装Chrome浏览器

    目录 linux CentOS 7上安装Chrome浏览器 添加Chrome浏览器的官方存储库,使用以下命令: 安装Chrome浏览器: 确认Chrome浏览器是否安装成功: linux CentOS ...

  2. Linux环境变量及其配置

    为什么要说这个呢? 本人喜欢使用Linux开发(工作是个硬要求,有些时候不能使用Linux,比如我上一个工作.但是有些时候呢,工作环境比较开放,我可以选择我喜欢的系统进行工作:比如我现在的工作.红红火 ...

  3. 一个可用于生产项目 基于 .NET 6 自研ORM

    Fast Framework 作者 Mr-zhong 代码改变世界.... 一.前言 Fast Framework 基于NET6.0 封装的轻量级 ORM 框架 支持多种数据库 SqlServer O ...

  4. 业务系统对接CAS

    启动类加@EnableCasClient <!--cas客户端--> <dependency> <groupId>net.unicon.cas</groupI ...

  5. for of 和 for in 的区别

    1 var arr = ["f", "6", 3, "a", 7]; 2 var obj = { name: "shun" ...

  6. Mastering Regular Expressions(精通正则表达式) 阅读笔记:前言

    General Concept(一般概念) If you master the general concept of regular expressions, it's a short step to ...

  7. ArcGIS Pro创建、发布、调用GP服务全过程示例(等高线分析)

    在之前的文章介绍过使用ArcMap发布GP分析服务,由于ArcGIS后续不在更新ArcMap,改用ArcGIS Pro,本文对ArcGIS Pro发布GP分析服务进行说明. 本文以等高线分析为例,使用 ...

  8. MD5简述及常见解密网址推荐

    什么是md5 MD5(Message-Digest Algorithm 5)(信息-摘要算法5), 一种被广泛使用的[密码散列函数](https://baike.baidu.com/item/密码散列 ...

  9. Prism Sample 8 ViewModelLocator

    这一例只是说明ViewModelLocator的使用,没有难度,跳过.

  10. 自动化部署(Gitlab)

    小程序可持续化自动部署 一.安装gitlab-runner 官方地址:https://docs.gitlab.com/runner/install/ windows安装如下: nodejs的环境变量一 ...