1. 程式人生 > 其它 >【MySQL】OR條件語句的優化

【MySQL】OR條件語句的優化

一、nginx部署Vue專案

前提條件是已經搭建好了nginx的環境,nginx預設的埠是80。其實我們知道,vue專案預設的埠是

8080,這個預設的埠這部分就不需要特殊的處理。我的整體vue的專案目錄結構如下:

1.1、修改vue的配置

在vue的專案中,找到vue.config.js,在這地方新增整體的路徑,具體檔案的內容資訊如下:

//強制關閉js的檔案檢查

module.exports = {
  publicPath: './',
  lintOnSave: false
}

1.2、構建vue專案

在vue的專案中,執行命令npm run build來進行構建,構建會就會打包在dist的目錄下,具體構建過

程如下:

npm run build #執行構建的命令

> [email protected] build /Applications/code/Yun/storm-ui
> vue-cli-service build

Browserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db

Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating

⠋  Building for production...

 WARNING  Compiled with 3 warnings                                                                                     21:04:53

 warning  

asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets: 
  js/chunk-vendors.f4967954.js (1.57 MiB)

 warning  

entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
  app (1.84 MiB)
      css/chunk-vendors.1f15154d.css
      js/chunk-vendors.f4967954.js
      css/app.2dade926.css
      js/app.6e24aa06.js


 warning  

webpack performance recommendations: 
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

  File                                   Size                                      Gzipped

  dist/js/chunk-vendors.f4967954.js      1610.91 KiB                               509.18 KiB
  dist/js/app.6e24aa06.js                63.34 KiB                                 13.24 KiB
  dist/css/chunk-vendors.1f15154d.css    205.07 KiB                                33.06 KiB
  dist/css/app.2dade926.css              3.36 KiB                                  0.90 KiB

  Images and other types of assets omitted.

 DONE  Build complete. The dist directory is ready to be deployed.
 INFO  Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html

構建成功後,下來把vue專案下的dist資料夾的內容上傳到Linux伺服器下的/usr/local/webapp

目錄下,具體上傳後,整體的內容如下:

tree webapp/
webapp/
└── dist
    ├── css
    │   ├── app.2dade926.css
    │   └── chunk-vendors.1f15154d.css
    ├── favicon.ico
    ├── fonts
    │   ├── element-icons.535877f5.woff
    │   └── element-icons.732389de.ttf
    ├── index.html
    └── js
        ├── app.6e24aa06.js
        ├── app.6e24aa06.js.map
        ├── chunk-vendors.f4967954.js
        └── chunk-vendors.f4967954.js.map

4 directories, 10 files

1.3、修改nginx.conf

下來修改下nginx.conf,具體完整的內容如下所示:

cat nginx.conf

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       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  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    server {
        listen       80;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root /usr/local/webapp/dist;
            #root   html;
            index  index.html index.htm;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }

1.4、熱啟動nginx

下來再次熱啟動nginx,具體命令如下:

[root@centos-master usr]# cd local/nginx/
[root@centos-master nginx]# pwd
/usr/local/nginx
[root@centos-master nginx]# sbin/nginx -t 
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful
[root@centos-master nginx]# sbin/nginx -s reload

1.5、驗證環境

下來直接使用伺服器的IP地址來訪問,如果能夠正常訪問,說明環境已部署OK,具體如下:

如上,整個vue的專案就可以很輕鬆的在nginx中部署成功。(我之前一直沒搞清楚,vue是8080埠,nginx是80埠

,其實忘記了nginx它具備反向代理的特性)。

歡迎關注微信公眾號“Python自動化測試”