Use CDN to accelerate React WebPack after packaging file details

  • 的头像-Tumi
  • 37 day agopublish

This article does not introduce the basic configuration of the WebPack. If you have any questions about the basic configuration, please refer to the official document.

1, configure WebPack.config.js

change Output.PublicPath to the uploaded CDN address, an example (corresponding to upload configuration):

PublicPath: “https:// Your_base_cdn_url” + process.env.node_env + “/ cdn /”
   
package

Node_env = Production node_modules / WebPack / Bin / WebPack.js -p
Such packaging files such as
   
hTML12345678.SRC.JS12345678.SRC.CSS …
At this time, after packaging CDN files have been introduced in the index.html file.

Title
   

 2, upload file to cDN    Write a script of uploading a CDN in a deployment script, an example :     echo "start uploading to upd" host = v0.ftp.upyun.cOMUSER = UPLOADER / YOUR-userNamePass = your-passwordcd buildfiles = $ (ls | grep -v 'index.html' | xargs) ftp -inv $ host  
Put home page Document upload to the server, using Nginx agent
Server {listen 80; server_name your_server_name; Access_log /var/log /nginx/your_project.log; root / var / www / your_project / production / current; location / {try_files $ uri /index.html = 404; add_header pragma no-cache; expires -5y;} location ~ \. (js | css) $ {expires 360000; add_header cache-control “max- Age = 360000; “;}}

Access HTTP: // Your_Server_Name can access the web page using the CDN acceleration.

The above-mentioned file detailed documentation using CDN accelerated React WebPack is the full content of Xiaobian sharing, I hope to give you a reference, I hope everyone will support Tumi Cloud.

© Copyright Notice
THE END
Just support it if you like
like0
share
comment Grab the couch

Please log in to comment