VSCode中Five Server扩展Live Preview无法加载本地CSS文件求助

先解决本地预览的根本问题 #

你遇到的Not allowed to load local resource错误，本质是浏览器安全策略禁止从file://协议加载本地资源，但Five Server本身是通过HTTP服务提供预览的，大概率是以下两个原因：

1. 你直接打开了本地HTML文件（地址栏是file://开头），而不是通过Five Server启动的服务。解决方法：右键HTML文件，选择Open with Five Server，此时地址栏会是http://localhost:端口号/xxx.html格式，这样就能正常加载CSS。
2. CSS引用用了绝对的file://路径。把路径改成相对路径，比如HTML在项目根目录，CSS在styles文件夹里，就写：

<link rel="stylesheet" href="./styles/style.css">

适合静态页面部署的云服务推荐 #

如果确实需要上传到云服务预览，这些平台适合个人练习或静态页面展示：

• Vercel：支持直接上传本地文件夹，或关联GitHub/GitLab仓库，部署后生成临时预览链接，免费额度足够日常使用，部署速度快。
• Netlify：拖拽本地文件夹就能完成部署，自带预览地址，还支持自定义域名，操作简单。
• GitHub Pages：将代码推送到GitHub仓库后，开启Pages功能即可生成访问链接，完全免费，适合存放个人练习项目。
• Cloudflare Pages：部署速度快，全球节点分发，免费版支持自定义域名和基础的静态页面部署需求。

内容的提问来源于stack exchange，提问作者giannistzkk_GW