如何在JavaScript中配置code-prettify使用本地pretty.css并规避CDN请求？

Absolutely! You can totally configure code-prettify to use your local pretty.css file instead of pulling from the CDN—no network calls required at all. Here's a straightforward breakdown of how to make it happen:

Step 1: Get the local CSS file #

First, grab a copy of pretty.css from the code-prettify source (you can pull it directly from the project's core files) and save it to a dedicated folder in your project—something like /assets/styles keeps things organized.

Step 2: Swap out the CDN CSS link #

If you currently have a link pointing to the CDN-hosted stylesheet (e.g., <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/pretty.min.css">), delete that line. Replace it with a reference to your local file:

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

Quick note: Double-check the file path! If your HTML file lives in a subdirectory, you’ll need to adjust the path (like ../assets/styles/pretty.css) to ensure the browser can find your local CSS.

Step 3: Load and initialize prettify #

You can choose to host the prettify.js file locally too if you want a fully offline setup, but even if you stick with the CDN for the JavaScript, the CSS will still come from your local file. Just make sure you initialize the tool properly:

<!-- Local JS example -->
<script src="/assets/scripts/prettify.js"></script>
<script>
  // Initialize prettify once the page is ready
  document.addEventListener('DOMContentLoaded', () => {
    prettyPrint();
  });
</script>

That’s all there is to it! From now on, code-prettify will use your local pretty.css exclusively—no network requests for styles will be sent out.

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