Skip to content

Commit e8b2243

Browse files
yuantongkanghaoqunjiang
authored andcommitted
docs(zh): update deployment.md (#3315) [ci skip]
1 parent 596a49d commit e8b2243

File tree

1 file changed

+61
-61
lines changed

1 file changed

+61
-61
lines changed

docs/zh/guide/deployment.md

+61-61
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,12 @@ serve -s dist
3838
(暂未翻译,此部分英文文档处于开放贡献中)
3939

4040
### GitHub Pages
41+
42+
1.`vue.config.js` 中设置正确的 `publicPath`
43+
44+
如果打算将项目部署到 `https://<USERNAME>.github.io/` 上 , `publicPath` 将默认被设为 `"/"`,你可以忽略这个参数。
4145

42-
1. Set correct `publicPath` in `vue.config.js`.
43-
44-
If you are deploying to `https://<USERNAME>.github.io/`, you can omit `publicPath` as it defaults to `"/"`.
45-
46-
If you are deploying to `https://<USERNAME>.github.io/<REPO>/`, (i.e. your repository is at `https://github.com/<USERNAME>/<REPO>`), set `publicPath` to `"/<REPO>/"`. For example, if your repo name is "my-project", your `vue.config.js` should look like this:
46+
如果打算将项目部署到 `https://<USERNAME>.github.io/<REPO>/` 上, (换句话说 仓库地址为 `https://github.com/<USERNAME>/<REPO>`), 可将 `publicPath` 设为 `"/<REPO>/"` 。 举个例子, 如果仓库名字为 "my-project",`vue.config.js` 的内容应如下所示:
4747

4848
``` js
4949
module.exports = {
@@ -53,67 +53,67 @@ serve -s dist
5353
}
5454
```
5555

56-
2. Inside your project, create `deploy.sh` with the following content (with highlighted lines uncommented appropriately) and run it to deploy:
56+
2. 在项目目录下, 用以下的代码创建 `deploy.sh`(可以适当地取消注释)并运行它以进行部署:
5757

5858
``` bash{13,20,23}
5959
#!/usr/bin/env sh
6060
61-
# abort on errors
61+
# 当发生错误时中止脚本
6262
set -e
6363
64-
# build
64+
# 构建
6565
npm run build
6666
67-
# navigate into the build output directory
67+
# cd 到构建输出的目录下
6868
cd dist
6969
70-
# if you are deploying to a custom domain
70+
# 部署到自定义域域名
7171
# echo 'www.example.com' > CNAME
7272
7373
git init
7474
git add -A
7575
git commit -m 'deploy'
7676
77-
# if you are deploying to https://<USERNAME>.github.io
77+
# 部署到 https://<USERNAME>.github.io
7878
# git push -f [email protected]:<USERNAME>/<USERNAME>.github.io.git master
7979
80-
# if you are deploying to https://<USERNAME>.github.io/<REPO>
80+
# 部署到 https://<USERNAME>.github.io/<REPO>
8181
# git push -f [email protected]:<USERNAME>/<REPO>.git master:gh-pages
8282
8383
cd -
8484
```
8585

8686
::: tip
87-
You can also run the above script in your CI setup to enable automatic deployment on each push.
87+
您还可以在 CI 设置中配置上述脚本,以便在每次推送时启用自动部署。
8888
:::
8989

9090
### GitLab Pages
9191

92-
As described by [GitLab Pages documentation](https://docs.gitlab.com/ee/user/project/pages/), everything happens with a `.gitlab-ci.yml` file placed in the root of your repository. This working example will get you started:
92+
根据 [GitLab Pages 文档](https://docs.gitlab.com/ee/user/project/pages/)的描述,所有的配置都在根目录中的`.gitlab-ci.yml` 文件中。下面的范例是一个很好的入门:
9393

9494
```yaml
95-
# .gitlab-ci.yml file to be placed in the root of your repository
95+
# .gitlab-ci.yml 文件应放在你仓库的根目录下
9696
97-
pages: # the job must be named pages
97+
pages: # 必须定义一个名为 pages 的 job
9898
image: node:latest
9999
stage: deploy
100100
script:
101101
- npm ci
102102
- npm run build
103-
- mv public public-vue # GitLab Pages hooks on the public folder
104-
- mv dist public # rename the dist folder (result of npm run build)
103+
- mv public public-vue # GitLab Pages 的钩子设置在 public 文件夹
104+
- mv dist public # 重命名 dist 文件夹 (npm run build 之后的输出位置)
105105
artifacts:
106106
paths:
107-
- public # artifact path must be /public for GitLab Pages to pick it up
107+
- public # artifact path 一定要在 /public , 这样 GitLab Pages 才能获取
108108
only:
109109
- master
110110
```
111111

112-
Typically, your static website will be hosted on https://yourUserName.gitlab.io/yourProjectName, so you will also want to create an initial `vue.config.js` file to [update the `BASE_URL`](https://github.com/vuejs/vue-cli/tree/dev/docs/config#baseurl) value to match:
112+
通常, 你的静态页面将托管在 https://yourUserName.gitlab.io/yourProjectName 上, 所以你可以创建一个 initial `vue.config.js` 文件去 [更新 `BASE_URL`](https://github.com/vuejs/vue-cli/tree/dev/docs/config#baseurl) 要匹配的值 :
113113

114114
```javascript
115-
// vue.config.js file to be place in the root of your repository
116-
// make sure you update `yourProjectName` with the name of your GitLab project
115+
// vue.config.js 位于仓库的根目录下
116+
// 确保用 GitLab 项目的名称替换了 `YourProjectName`
117117
118118
module.exports = {
119119
publicPath: process.env.NODE_ENV === 'production'
@@ -122,46 +122,46 @@ module.exports = {
122122
}
123123
```
124124

125-
Please read through the docs on [GitLab Pages domains](https://docs.gitlab.com/ee/user/project/pages/getting_started_part_one.html#gitlab-pages-domain) for more info about the URL where your project website will be hosted. Be aware you can also [use a custom domain](https://docs.gitlab.com/ee/user/project/pages/getting_started_part_three.html#adding-your-custom-domain-to-gitlab-pages).
125+
请阅读在 [GitLab Pages domains](https://docs.gitlab.com/ee/user/project/pages/getting_started_part_one.html#gitlab-pages-domain) 的文档来学习更多关于页面部署 URL 的信息。注意,你也可以[使用自定义域名](https://docs.gitlab.com/ee/user/project/pages/getting_started_part_three.html#adding-your-custom-domain-to-gitlab-pages)
126126

127-
Commit both the `.gitlab-ci.yml` and `vue.config.js` files before pushing to your repository. A GitLab CI pipeline will be triggered: when successful, visit your project's `Settings > Pages` to see your website link, and click on it.
127+
在推送到仓库之前提交 `.gitlab-ci.yml` `vue.config.js` 文件。GitLab CI 的管道将会被触发: 当成功时候, 到 `Settings > Pages` 查看关于网站的链接。
128128

129129
### Netlify
130130

131-
1. On Netlify, setup up a new project from GitHub with the following settings:
131+
1. Netlify 上,使用以下设置从 GitHub 创建新项目:
132132

133-
- **Build Command:** `npm run build` or `yarn build`
134-
- **Publish directory:** `dist`
133+
- **构建命令:** `npm run build` or `yarn build`
134+
- **发布目录:** `dist`
135135

136-
2. Hit the deploy button!
136+
2. 点击 deploy 按钮!
137137

138-
Also checkout [vue-cli-plugin-netlify-lambda](https://github.com/netlify/vue-cli-plugin-netlify-lambda).
138+
也可以查看 [vue-cli-plugin-netlify-lambda](https://github.com/netlify/vue-cli-plugin-netlify-lambda)
139139

140140
### Amazon S3
141141

142-
See [vue-cli-plugin-s3-deploy](https://github.com/multiplegeorges/vue-cli-plugin-s3-deploy).
142+
[vue-cli-plugin-s3-deploy](https://github.com/multiplegeorges/vue-cli-plugin-s3-deploy)
143143

144144
### Firebase
145145

146-
Create a new Firebase project on your [Firebase console](https://console.firebase.google.com). Please refer to this [documentation](https://firebase.google.com/docs/web/setup) on how to setup your project.
146+
创建一个新的 Firebase 项目 [Firebase console](https://console.firebase.google.com)。 请参考[文档](https://firebase.google.com/docs/web/setup)
147147

148-
Make sure you have installed [firebase-tools](https://github.com/firebase/firebase-tools) globally:
148+
确保已经全局安装了 [firebase-tools](https://github.com/firebase/firebase-tools)
149149

150150
```
151151
npm install -g firebase-tools
152152
```
153153

154-
From the root of your project, initialize `firebase` using the command:
154+
在项目的根目录下, 用以下命令初始化 `firebase`
155155

156156
```
157157
firebase init
158158
```
159159

160-
Firebase will ask some questions on how to setup your project.
160+
Firebase 将会询问有关初始化项目的一些问题。
161161

162-
- Choose which Firebase CLI features you want to setup your project. Make sure to select `hosting`.
163-
- Select the default Firebase project for your project.
164-
- Set your `public` directory to `dist` (or where your build's output is) which will be uploaded to Firebase Hosting.
162+
- 选择需要 Firebase CLI 的功能。 一定要选择 `hosting`
163+
- 选择默认的 Firebase 项目。
164+
- `public` 目录设为 `dist` (或构建输出的位置) 这将会上传到 Firebase Hosting
165165

166166
```javascript
167167
// firebase.json
@@ -173,7 +173,7 @@ Firebase will ask some questions on how to setup your project.
173173
}
174174
```
175175

176-
- Select `yes` to configure your project as a single-page app. This will create an `index.html` and on your `dist` folder and configure your `hosting` information.
176+
- 选择 `yes` 设置项目为一个单页应用。 这将会创建一个 `index.html` `dist` 文件夹并且配置 `hosting` 信息。
177177

178178
```javascript
179179
// firebase.json
@@ -190,25 +190,25 @@ Firebase will ask some questions on how to setup your project.
190190
}
191191
```
192192

193-
Run `npm run build` to build your project.
193+
执行 `npm run build` 去构建项目。
194194

195-
To deploy your project on Firebase Hosting, run the command:
195+
`Firebase Hosting` 部署项目,执行以下命令 :
196196

197197
```
198198
firebase deploy --only hosting
199199
```
200200

201-
If you want other Firebase CLI features you use on your project to be deployed, run `firebase deploy` without the `--only` option.
201+
如果需要在部署的项目中使用的其他 Firebase CLI 功能, 执行 `firebase deploy` 去掉 `--only` 参数。
202202

203-
You can now access your project on `https://<YOUR-PROJECT-ID>.firebaseapp.com`.
203+
现在可以到 `https://<YOUR-PROJECT-ID>.firebaseapp.com` 访问你的项目了。
204204

205-
Please refer to the [Firebase Documentation](https://firebase.google.com/docs/hosting/deploying) for more details.
205+
请参考 [Firebase 文档](https://firebase.google.com/docs/hosting/deploying) 来获取更多细节。
206206

207207
### Now
208208

209-
1. Install the Now CLI globally: `npm install -g now`
209+
1. 全局安装 Now CLI: `npm install -g now`
210210

211-
2. Add a `now.json` file to your project root:
211+
2. 添加 `now.json` 文件到项目根目录 :
212212

213213
```json
214214
{
@@ -230,21 +230,21 @@ Please refer to the [Firebase Documentation](https://firebase.google.com/docs/ho
230230
}
231231
```
232232

233-
You can further customize the static serving behavior by consulting [Now's documentation](https://zeit.co/docs/deployment-types/static).
233+
您可以通过阅读来进一步了解自定义静态服务的信息 [Now's 文档](https://zeit.co/docs/deployment-types/static)
234234
235-
3. Adding a deployment script in `package.json`:
235+
3. `package.json` 中添加部署脚本:
236236
237237
```json
238238
"deploy": "npm run build && now && now alias"
239239
```
240240
241-
If you want to deploy publicly by default, you can change the deployment script to the following one:
241+
如果想要将项目默认公开部署,部署脚本如下
242242
243243
```json
244244
"deploy": "npm run build && now --public && now alias"
245245
```
246246
247-
This will automatically point your site's alias to the latest deployment. Now, just run `npm run deploy` to deploy your app.
247+
这将自动将站点的别名指向最新的部署。现在,只要运行 `npm run deploy` 就可以部署你的应用。
248248
249249
### Stdlib
250250
@@ -256,15 +256,15 @@ Please refer to the [Firebase Documentation](https://firebase.google.com/docs/ho
256256
257257
### Surge
258258
259-
To deploy with [Surge](http://surge.sh/) the steps are very straightforward.
259+
要使用 [Surge](http://surge.sh/) 进行部署,步骤非常简单。
260260
261-
First you would need to build your project by running `npm run build`. And if you haven't installed Surge's command line tool, you can simply do so by running the command:
261+
首先,通过运行 `npm run build` 来构建项目。如果还没有安装 Surge 的命令行工具,可以通过运行命令来执行此操作:
262262
263263
```
264264
npm install --global surge
265265
```
266266
267-
Then cd into the `dist/` folder of your project and then run `surge` and follow the screen prompt. It will ask you to set up email and password if it is the first time you are using Surge. Confirm the project folder and type in your preferred domain and watch your project being deployed such as below.
267+
然后 cd 进入项目的 `dist/` 文件夹,然后运行 `surge` 并按照屏幕提示操作 。如果是第一次使用 Surge,它会要求设置电子邮件和密码。确认项目文件夹以及输入首选域来查看正在部署的项目,如下所示。
268268
269269
```
270270
project: /Users/user/Documents/myawesomeproject/dist/
@@ -276,30 +276,30 @@ Then cd into the `dist/` folder of your project and then run `surge` and follow
276276
Success! - Published to myawesomeproject.surge.sh
277277
```
278278
279-
Verify your project is successfully published by Surge by visiting `myawesomeproject.surge.sh`, vola! For more setup details such as custom domains, you can visit [Surge's help page](https://surge.sh/help/).
279+
通过访问 `myawesomeproject.surge.sh` 来确保你的项目已经成功的用 Surge 发布,有关自定义域名等更多设置详细信息,可以到 [Surge's help page](https://surge.sh/help/) 查看。
280280

281281
### Bitbucket Cloud
282282

283-
1. As described in the [Bitbucket documentation](https://confluence.atlassian.com/bitbucket/publishing-a-website-on-bitbucket-cloud-221449776.html) you need to create a repository named exactly `<USERNAME>.bitbucket.io`.
283+
1. [Bitbucket 文档](https://confluence.atlassian.com/bitbucket/publishing-a-website-on-bitbucket-cloud-221449776.html) 创建一个命名为 `<USERNAME>.bitbucket.io` 的仓库。
284284

285-
2. It is possible to publish to a subfolder of the main repository, for instance if you want to have multiple websites. In that case set correct `publicPath` in `vue.config.js`.
285+
2. 如果你想拥有多个网站, 想要发布到主仓库的子文件夹中。这种情况下就要在 `vue.config.js` 设置 `publicPath`
286286

287-
If you are deploying to `https://<USERNAME>.bitbucket.io/`, you can omit `publicPath` as it defaults to `"/"`.
287+
如果部署到 `https://<USERNAME>.bitbucket.io/``publicPath` 默认将被设为 `"/"`,你可以选择忽略它。
288288

289-
If you are deploying to `https://<USERNAME>.bitbucket.io/<SUBFOLDER>/`, set `publicPath` to `"/<SUBFOLDER>/"`. In this case the directory structure of the repository should reflect the url structure, for instance the repository should have a `/<SUBFOLDER>` directory.
289+
如果要部署到 `https://<USERNAME>.bitbucket.io/<SUBFOLDER>/`,设置 `publicPath` `"/<SUBFOLDER>/"`。在这种情况下,仓库的目录结构应该反映 url 结构,例如仓库应该有 `/<SUBFOLDER>` 目录。
290290

291-
3. Inside your project, create `deploy.sh` with the following content and run it to deploy:
291+
3. 在项目中, `deploy.sh` 使用以下内容创建并运行它以进行部署:
292292

293293
``` bash{13,20,23}
294294
#!/usr/bin/env sh
295295
296-
# abort on errors
296+
# 当发生错误时中止脚本
297297
set -e
298298
299-
# build
299+
# 构建
300300
npm run build
301301
302-
# navigate into the build output directory
302+
# cd 到构建输出的目录
303303
cd dist
304304
305305
git init

0 commit comments

Comments
 (0)