aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorxcodebuild <me@xcodebuild.com>2022-02-14 14:21:21 +0800
committerIrvin <irvinfly@gmail.com>2022-02-16 00:03:23 +0800
commit76c2fdbe9ccc65244df60929fa17bce3ebc70117 (patch)
tree7c4865706ed0c717d25e0accc799ea11bc11cd07
parent4683269e0b0b23505559c4ac25744bc5693b68a4 (diff)
downloadtranslated-content-76c2fdbe9ccc65244df60929fa17bce3ebc70117.tar.gz
translated-content-76c2fdbe9ccc65244df60929fa17bce3ebc70117.tar.bz2
translated-content-76c2fdbe9ccc65244df60929fa17bce3ebc70117.zip
fix case of JavaScript, Javascript -> JavaScript
-rw-r--r--files/zh-cn/web/javascript/guide/modules/index.html22
1 files changed, 11 insertions, 11 deletions
diff --git a/files/zh-cn/web/javascript/guide/modules/index.html b/files/zh-cn/web/javascript/guide/modules/index.html
index 1b0192666f..816f3e13ee 100644
--- a/files/zh-cn/web/javascript/guide/modules/index.html
+++ b/files/zh-cn/web/javascript/guide/modules/index.html
@@ -11,13 +11,13 @@ translation_of: Web/JavaScript/Guide/Modules
---
<div>{{jsSidebar("JavaScript Guide")}}{{Previous("Web/JavaScript/Guide/Meta_programming")}}</div>
-<p>这篇指南会给你入门 Javascript 模块的全部信息。</p>
+<p>这篇指南会给你入门 JavaScript 模块的全部信息。</p>
<h2 id="模块化的背景">模块化的背景</h2>
-<p>Javascript 程序本来很小——在早期,它们大多被用来执行独立的脚本任务,在你的 web 页面需要的地方提供一定交互,所以一般不需要多大的脚本。过了几年,我们现在有了运行大量 Javascript 脚本的复杂程序,还有一些被用在其他环境(例如 <a href="/en-US/docs/Glossary/Node.js">Node.js</a>)。</p>
+<p>JavaScript 程序本来很小——在早期,它们大多被用来执行独立的脚本任务,在你的 web 页面需要的地方提供一定交互,所以一般不需要多大的脚本。过了几年,我们现在有了运行大量 JavaScript 脚本的复杂程序,还有一些被用在其他环境(例如 <a href="/en-US/docs/Glossary/Node.js">Node.js</a>)。</p>
-<p>因此,近年来,有必要开始考虑提供一种<u>将 JavaScript 程序拆分为可按需导入的单独模块</u>的机制。Node.js 已经提供这个能力很长时间了,还有很多的 Javascript 库和框架 已经开始了模块的使用(例如, <a href="https://en.wikipedia.org/wiki/CommonJS">CommonJS</a> 和基于 <a href="https://github.com/amdjs/amdjs-api/blob/master/AMD.md">AMD</a> 的其他模块系统 如 <a href="https://requirejs.org/">RequireJS</a>, 以及最新的 <a href="https://webpack.github.io/">Webpack</a> 和 <a href="https://babeljs.io/">Babel</a>)。</p>
+<p>因此,近年来,有必要开始考虑提供一种<u>将 JavaScript 程序拆分为可按需导入的单独模块</u>的机制。Node.js 已经提供这个能力很长时间了,还有很多的 JavaScript 库和框架 已经开始了模块的使用(例如, <a href="https://en.wikipedia.org/wiki/CommonJS">CommonJS</a> 和基于 <a href="https://github.com/amdjs/amdjs-api/blob/master/AMD.md">AMD</a> 的其他模块系统 如 <a href="https://requirejs.org/">RequireJS</a>, 以及最新的 <a href="https://webpack.github.io/">Webpack</a> 和 <a href="https://babeljs.io/">Babel</a>)。</p>
<p>好消息是,最新的浏览器开始原生支持模块功能了,这是本文要重点讲述的。这会是一个好事情 — 浏览器能够最优化加载模块,使它比使用库更有效率:使用库通常需要做额外的客户端处理。</p>
@@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Guide/Modules
<p>这的确有点简单,但是保持足够简单能够清晰地演示模块。</p>
<div class="blockIndicator note">
-<p><strong>Note</strong>: 如果你想去下载这个例子在本地运行,你需要通过本地web 服务器去运行。</p>
+<p><strong>Note</strong>: 如果你想去下载这个例子在本地运行,你需要通过本地 web 服务器去运行。</p>
</div>
<h2 id="基本的示例文件的结构">基本的示例文件的结构</h2>
@@ -90,7 +90,7 @@ modules/
<li>这能保证你的模块可以被运行时环境和构建工具识别,比如  <a href="https://nodejs.org/api/esm.html#esm_enabling">Node.js</a> 和 <a href="https://babeljs.io/docs/en/options#sourcetype">Babel</a>。</li>
</ul>
-<p>但是我们决定继续使用 <code>.js</code> 扩展名,未来可能会更改。为了使模块可以在浏览器中正常地工作,你需要确保你的服务器能够正常地处理 <code>Content-Type</code> 头,其应该包含 Javascript 的MIME 类型  <code>text/javascript</code>。如果没有这么做,你可能会得到 一个严格 MIME 类型检查错误:“The server responded with a non-JavaScript MIME type (服务器返回了非 JavaScript MIME 类型)”,并且浏览器会拒绝执行相应的 JavaScript 代码。多数服务器可以正确地处理 <code>.js</code> 文件的类型,但是 <code>.mjs</code> 还不行。已经可以正常响应 <code>.mjs</code> 的服务器有 <a href="https://pages.github.com/">GitHub 页面</a> 和 Node.js 的 <code><a href="https://github.com/http-party/http-server#readme">http-server</a></code>。</p>
+<p>但是我们决定继续使用 <code>.js</code> 扩展名,未来可能会更改。为了使模块可以在浏览器中正常地工作,你需要确保你的服务器能够正常地处理 <code>Content-Type</code> 头,其应该包含 JavaScript 的MIME 类型  <code>text/javascript</code>。如果没有这么做,你可能会得到 一个严格 MIME 类型检查错误:“The server responded with a non-JavaScript MIME type (服务器返回了非 JavaScript MIME 类型)”,并且浏览器会拒绝执行相应的 JavaScript 代码。多数服务器可以正确地处理 <code>.js</code> 文件的类型,但是 <code>.mjs</code> 还不行。已经可以正常响应 <code>.mjs</code> 的服务器有 <a href="https://pages.github.com/">GitHub 页面</a> 和 Node.js 的 <code><a href="https://github.com/http-party/http-server#readme">http-server</a></code>。</p>
<p> 如果你已经在使用相应的环境了,那么一切正常。或者如果你还没有,但你知道你在做什么(比如你可以配置服务器以为 <code>.mjs</code> 设置正确的 <code>Content-Type</code>)。但如果你不能控制提供服务,或者用于公开文件发布的服务器,这可能会导致混乱。</p>
@@ -184,10 +184,10 @@ reportPerimeter(square1.length, reportList);
<h2 id="其他模块与标准脚本的不同">其他模块与标准脚本的不同</h2>
<ul>
- <li>你需要注意本地测试 —  如果你通过本地加载Html 文件 (比如一个 <code>file://</code> 路径的文件), 你将会遇到 CORS 错误,因为Javascript 模块安全性需要。你需要通过一个服务器来测试。</li>
+ <li>你需要注意本地测试 —  如果你通过本地加载Html 文件 (比如一个 <code>file://</code> 路径的文件), 你将会遇到 CORS 错误,因为JavaScript 模块安全性需要。你需要通过一个服务器来测试。</li>
<li>另请注意,您可能会从模块内部定义的脚本部分获得不同的行为,而不是标准脚本。 这是因为模块自动使用严格模式。</li>
<li>加载一个模块脚本时不需要使用 <code>defer</code> 属性 (see <a href="/en-US/docs/Web/HTML/Element/script#Attributes"><code>&lt;script&gt;</code> attributes</a>) 模块会自动延迟加载。</li>
- <li>最后一个但不是不重要,你需要明白模块功能导入到单独的脚本文件的范围 — 他们无法在全局获得。因此,你只能在导入这些功能的脚本文件中使用他们,你也无法通过Javascript console 中获取到他们,比如,在DevTools 中你仍然能够获取到语法错误,但是你可能无法像你想的那样使用一些debug 技术 </li>
+ <li>最后一个但不是不重要,你需要明白模块功能导入到单独的脚本文件的范围 — 他们无法在全局获得。因此,你只能在导入这些功能的脚本文件中使用他们,你也无法通过 JavaScript console 中获取到他们,比如,在DevTools 中你仍然能够获取到语法错误,但是你可能无法像你想的那样使用一些debug 技术 </li>
</ul>
<h2 id="默认导出_versus_命名导出">默认导出 versus 命名导出</h2>
@@ -389,7 +389,7 @@ export { Circle } from '/js-examples/modules/module-aggregation/modules/shapes/c
<p>它们从各个子模块中获取导出,并有效地从<code>shapes.mjs</code>模块中获取它们。</p>
<div class="blockIndicator note">
-<p><strong>Note</strong>: 即使<code>shapes.mjs</code>文件位于modules目录中,我们仍然需要相对于模块根目录编写这些URL,因此需要<code>/modules/</code>。 这是使用JavaScript模块时混淆的常见原因。</p>
+<p><strong>Note</strong>: 即使<code>shapes.mjs</code>文件位于 modules 目录中,我们仍然需要相对于模块根目录编写这些URL,因此需要<code>/modules/</code>。 这是使用JavaScript模块时混淆的常见原因。</p>
</div>
<div class="blockIndicator note">
@@ -443,9 +443,9 @@ import { Triangle } from './modules/triangle.mjs';</pre>
<p>如果为了你的模块有问题,这里有一些提示有可能帮助到你。如果你发现更多的内容欢迎添加进来!</p>
<ul>
- <li>在前面已经提到了,在这里再重申一次: <code>.mjs</code> 后缀的文件需要以 MIME-type 为 <code>javascript/esm</code> 来加载(或者其他的JavaScript 兼容的 MIME-type ,比如 <code>application/javascript</code>), 否则,你会一个严格的 MIME 类型检查错误,像是这样的 "The server responded with a non-JavaScript MIME type".</li>
- <li>如果你尝试用本地文件加载HTML 文件 (i.e. with a <code>file://</code> URL), 由于JavaScript 模块的安全性要求,你会遇到CORS 错误。你需要通过服务器来做你的测试。GitHub pages is ideal as it also serves <code>.mjs</code> files with the correct MIME type.</li>
- <li>因为<code>.mjs</code> 是一个相当新的文件后缀, 一些操作系统可能无法识别,或者尝试把它替换成别的。比如,我们发现macOS悄悄地该我们的 <code>.mjs</code> 后缀的文件后面添加上 <code>.js</code>  然后自动隐藏这个后缀。所以我们的文件实际上都是 <code>x.mjs.js</code>. 当我们关闭自动隐藏文件后缀名,让它去接受认可 <code>.mjs</code>。问题解决。</li>
+ <li>在前面已经提到了,在这里再重申一次: <code>.mjs</code> 后缀的文件需要以 MIME-type 为 <code>javascript/esm</code> 来加载(或者其他的 JavaScript 兼容的 MIME-type ,比如 <code>application/javascript</code>), 否则,你会一个严格的 MIME 类型检查错误,像是这样的 "The server responded with a non-JavaScript MIME type".</li>
+ <li>如果你尝试用本地文件加载 HTML 文件 (i.e. with a <code>file://</code> URL), 由于 JavaScript 模块的安全性要求,你会遇到 CORS 错误。你需要通过服务器来做你的测试。GitHub pages is ideal as it also serves <code>.mjs</code> files with the correct MIME type.</li>
+ <li>因为<code>.mjs</code> 是一个相当新的文件后缀, 一些操作系统可能无法识别,或者尝试把它替换成别的。比如,我们发现 macOS 悄悄地该我们的 <code>.mjs</code> 后缀的文件后面添加上 <code>.js</code>  然后自动隐藏这个后缀。所以我们的文件实际上都是 <code>x.mjs.js</code>. 当我们关闭自动隐藏文件后缀名,让它去接受认可 <code>.mjs</code>。问题解决。</li>
</ul>
<h2 id="参见">参见</h2>