Skip to content

Commit d15f3ad

Browse files
committed
2020年10月14日07:33:47
1 parent 28428eb commit d15f3ad

File tree

2 files changed

+211
-44
lines changed

2 files changed

+211
-44
lines changed

src/guide/installation.md

+88-14
Original file line numberDiff line numberDiff line change
@@ -91,20 +91,47 @@ $ yarn
9191
$ yarn dev
9292
```
9393

94-
## Explanation of Different Builds
94+
## Explanation of Different Builds 不同打包的解释
9595

96-
In the [`dist/` directory of the npm package](https://cdn.jsdelivr.net/npm/[email protected]/dist/) you will find many different builds of Vue.js. Here is an overview of which `dist` file should be used depending on the use-case.
96+
In the [`dist/` directory of the npm package](https://cdn.jsdelivr.net/npm/[email protected]/dist/) you will find many different builds of Vue.js.
97+
在npm包的[' dist/ '目录](https://cdn.jsdelivr.net/npm/[email protected]/dist/)中,你会发现许多不同版本的Vue.js。
98+
99+
Here is an overview of which `dist` file should be used depending on the use-case.
100+
以下是应该根据用例使用哪个“dist”文件的概述。
97101

98102
### From CDN or without a Bundler
103+
从CDN或没有捆绑
99104

100105
#### `vue(.runtime).global(.prod).js`:
101106

102107
- For direct use via `<script src="...">` in the browser, exposes the Vue global.
108+
-直接使用通过' <script src="…“>”在浏览器中,公开Vue全局变量。
109+
110+
111+
103112
- In-browser template compilation:
104-
- `vue.global.js` is the "full" build that includes both the compiler and the runtime so it supports compiling templates on the fly.
105-
- `vue.runtime.global.js` contains only the runtime and requires templates to be pre-compiled during a build step.
106-
- Inlines all Vue core internal packages - i.e. it's a single file with no dependencies on other files. This means you must import everything from this file and this file only to ensure you are getting the same instance of code.
107-
- Contains hard-coded prod/dev branches, and the prod build is pre-minified. Use the `*.prod.js` files for production.
113+
-浏览器内模板编译:
114+
115+
- `vue.global.js` is the "full" build that includes both the compiler and the runtime so it supports compiling templates on the fly.
116+
——“vue.global.js是“完整的”构建,包括编译器和运行时,所以它支持动态编译模板。
117+
118+
- `vue.runtime.global.js` contains only the runtime and requires templates to be pre-compiled during a build step.
119+
- ' vue.runtime.global.js '只包含运行时,并且要求模板在构建过程中进行预编译。
120+
121+
- Inlines all Vue core internal packages - i.e. it's a single file with no dependencies on other files.
122+
-内联所有Vue核心内部包-即,它是一个独立的文件,不依赖于其他文件。
123+
124+
This means you must import everything from this file and this file only to ensure you are getting the same instance of code.
125+
这意味着您必须从这个文件和这个文件中导入所有内容,以确保获得相同的代码实例。
126+
127+
- Contains hard-coded prod/dev branches, and the prod build is pre-minified.
128+
-包含硬编码的prod/dev分支,并且prod构建是预先缩小的。
129+
130+
Use the `*.prod.
131+
使用‘* .prod。
132+
133+
js` files for production.
134+
js的文件用于生产。
108135

109136
:::tip Note
110137
Global builds are not [UMD](https://github.com/umdjs/umd) builds. They are built as [IIFEs](https://developer.mozilla.org/en-US/docs/Glossary/IIFE) and are only meant for direct use via `<script src="...">`.
@@ -113,34 +140,75 @@ Global builds are not [UMD](https://github.com/umdjs/umd) builds. They are built
113140
#### vue(.runtime).esm-browser(.prod).js:
114141

115142
- For usage via native ES modules imports (in browser via `<script type="module">`.
143+
-通过本地ES模块导入使用(在浏览器中通过`<script type="module"> `
144+
116145
- Shares the same runtime compilation, dependency inlining and hard-coded prod/dev behavior with the global build.
146+
-与全局构建共享相同的运行时编译、依赖内联和硬编码的prod/dev行为。
117147

118148
### With a Bundler
119149

120150
#### vue(.runtime).esm-bundler.js:
121151

122152
- For use with bundlers like `webpack`, `rollup` and `parcel`.
123-
- Leaves prod/dev branches with `process.env.NODE_ENV guards` (must be replaced by bundler)
153+
-与“webpack”、“rollup”及“parcel”等捆扎程序一起使用。
154+
155+
- Leaves prod/dev branches with `process.env.
156+
-将prod/dev分支设置为“process.env”。
157+
158+
NODE_ENV guards` (must be replaced by bundler)
159+
NODE_ENV guard '(必须被bundler替换)
160+
124161
- Does not ship minified builds (to be done together with the rest of the code after bundling)
125-
- Imports dependencies (e.g. `@vue/runtime-core`, `@vue/runtime-compiler`)
126-
- Imported dependencies are also esm-bundler builds and will in turn import their dependencies (e.g. @vue/runtime-core imports @vue/reactivity)
127-
- This means you **can** install/import these deps individually without ending up with different instances of these dependencies, but you must make sure they all resolve to the same version.
162+
-不提供缩小的构建(在绑定后与其余代码一起完成)
163+
164+
- Imports dependencies (e.g.
165+
-导入依赖项(例如:
166+
167+
`@vue/runtime-core`, `@vue/runtime-compiler`)
168+
@vue / runtime-core”、“@vue /运行时编译)
169+
170+
- Imported dependencies are also esm-bundler builds and will in turn import their dependencies (e.g. @vue/runtime-core imports @vue/reactivity)
171+
导入的依赖项也是esm-bundler构建,并将依次导入它们的依赖项(例如@vue/运行时-core导入@vue/reactivity)
172+
173+
- This means you **can** install/import these deps individually without ending up with different instances of these dependencies, but you must make sure they all resolve to the same version.
174+
-这意味着您可以** *单独安装/导入这些dep,而不会导致这些依赖项的不同实例,但您必须确保它们都解析为相同的版本。
175+
128176
- In-browser template compilation:
129-
- `vue.runtime.esm-bundler.js` **(default)** is runtime only, and requires all templates to be pre-compiled. This is the default entry for bundlers (via module field in `package.json`) because when using a bundler templates are typically pre-compiled (e.g. in `*.vue` files).
130-
- `vue.esm-bundler.js`: includes the runtime compiler. Use this if you are using a bundler but still want runtime template compilation (e.g. in-DOM templates or templates via inline JavaScript strings). You will need to configure your bundler to alias vue to this file.
177+
-浏览器内模板编译:
178+
179+
- `vue.runtime.esm-bundler.js` **(default)** is runtime only, and requires all templates to be pre-compiled.
180+
- ' vue.runtime.esm-bundler.js '的**(默认)**是只运行时的,并且要求所有的模板都是预先编译的。
131181

182+
This is the default entry for bundlers (via module field in `package.json`) because when using a bundler templates are typically pre-compiled (e.g. in `*.
183+
这是绑定器的默认条目(通过‘package.json’中的模块字段),因为使用绑定器模板通常是预编译的(例如在‘*中)。
184+
vue` files).
185+
vue的文件)。
186+
187+
- `vue.esm-bundler.js`: includes the runtime compiler.
188+
- ' vue.esm-bundler.js ':包含运行时编译器。
189+
190+
Use this if you are using a bundler but still want runtime template compilation (e.g. in-DOM templates or templates via inline JavaScript strings).
191+
如果你正在使用一个bundler但仍然需要运行时模板编译(例如dom内模板或通过内联JavaScript字符串的模板),可以使用这个。
192+
193+
You will need to configure your bundler to alias vue to this file.
194+
您将需要配置您的bundler以将vue别名配置到这个文件。
132195
### For Server-Side Rendering
133196

134197
#### `vue.cjs(.prod).js`:
135198

136199
- For use in Node.js server-side rendering via `require()`.
200+
-通过`require()`用于Node.js服务器端渲染。
201+
137202
- If you bundle your app with webpack with `target: 'node'` and properly externalize `vue`, this is the build that will be loaded.
203+
-如果你把你的应用和webpack捆绑在一起,并正确地具体化“vue”,这就是将要加载的版本。
204+
138205
- The dev/prod files are pre-built, but the appropriate file is automatically required based on `process.env.NODE_ENV`.
206+
- dev/prod文件是预构建的,但是根据' process.env.NODE_ENV '自动需要相应的文件。
139207

140208
## Runtime + Compiler vs. Runtime-only
141209

142210
If you need to compile templates on the client (e.g. passing a string to the template option, or mounting to an element using its in-DOM HTML as the template), you will need the compiler and thus the full build:
143-
211+
如果你需要在客户端编译模板(例如,传递一个字符串到模板选项,或挂载到一个元素使用它的in-DOM HTML作为模板),你将需要编译器和完整的构建:
144212
```js
145213
// this requires the compiler
146214
Vue.createApp({
@@ -154,5 +222,11 @@ Vue.createApp({
154222
}
155223
})
156224
```
225+
When using `vue-loader`, templates inside `*.
226+
当使用' vue-loader '时,模板在' *中。
227+
228+
vue` files are pre-compiled into JavaScript at build time.
229+
vue的文件在构建时被预编译成JavaScript。
157230

158-
When using `vue-loader`, templates inside `*.vue` files are pre-compiled into JavaScript at build time. You don’t really need the compiler in the final bundle, and can therefore use the runtime-only build.
231+
You don’t really need the compiler in the final bundle, and can therefore use the runtime-only build.
232+
您实际上并不需要最终包中的编译器,因此可以使用只运行时的构建。

0 commit comments

Comments
 (0)