From e7af0d8fa374311693f14d1605e7ae442e43c3a6 Mon Sep 17 00:00:00 2001 From: Haoqun Jiang Date: Mon, 7 Jan 2019 21:20:05 +0800 Subject: [PATCH] feat: deprecate confusing `baseUrl` option, use `publicPath` instead. (#3143) * feat: deprecate confusing `baseUrl` option, use `publicPath` instead. * fix: do not touch CHANGELOG.md * docs: links referring baseUrl now changed to publicPath --- docs/config/README.md | 16 ++++--- docs/guide/deployment.md | 20 ++++----- docs/guide/html-and-static-assets.md | 8 ++-- docs/guide/mode-and-env.md | 2 +- docs/guide/webpack.md | 2 +- docs/ru/config/README.md | 14 +++--- docs/ru/guide/deployment.md | 20 ++++----- docs/ru/guide/html-and-static-assets.md | 8 ++-- docs/ru/guide/mode-and-env.md | 2 +- docs/ru/guide/webpack.md | 2 +- docs/zh/config/README.md | 14 +++--- docs/zh/guide/deployment.md | 20 ++++----- docs/zh/guide/html-and-static-assets.md | 8 ++-- docs/zh/guide/mode-and-env.md | 2 +- docs/zh/guide/webpack.md | 2 +- .../cli-service/__tests__/Service.spec.js | 43 +++++++++++++++---- packages/@vue/cli-service/lib/Service.js | 29 ++++++++++--- .../@vue/cli-service/lib/commands/serve.js | 14 +++--- packages/@vue/cli-service/lib/config/app.js | 2 +- packages/@vue/cli-service/lib/config/base.js | 2 +- packages/@vue/cli-service/lib/config/dev.js | 2 +- packages/@vue/cli-service/lib/options.js | 3 +- .../cli-service/lib/util/resolveClientEnv.js | 2 +- .../lib/util/validateWebpackConfig.js | 4 +- .../cli-service/lib/webpack/CorsPlugin.js | 6 +-- packages/@vue/cli-ui/index.js | 2 +- packages/@vue/cli-ui/locales/en.json | 4 ++ packages/@vue/cli-ui/ui-defaults/config.js | 10 ++--- 28 files changed, 158 insertions(+), 105 deletions(-) diff --git a/docs/config/README.md b/docs/config/README.md index 3f42cd58d1..96560b8511 100644 --- a/docs/config/README.md +++ b/docs/config/README.md @@ -31,17 +31,21 @@ module.exports = { ### baseUrl +Deprecated since Vue CLI 3.3, please use [`publicPath`](#publicPath) instead. + +### publicPath + - Type: `string` - Default: `'/'` - The base URL your application bundle will be deployed at. This is the equivalent of webpack's `output.publicPath`, but Vue CLI also needs this value for other purposes, so you should **always use `baseUrl` instead of modifying webpack `output.publicPath`**. + The base URL your application bundle will be deployed at (known as `baseUrl` before Vue CLI 3.3). This is the equivalent of webpack's `output.publicPath`, but Vue CLI also needs this value for other purposes, so you should **always use `publicPath` instead of modifying webpack `output.publicPath`**. - By default, Vue CLI assumes your app will be deployed at the root of a domain, e.g. `https://www.my-app.com/`. If your app is deployed at a sub-path, you will need to specify that sub-path using this option. For example, if your app is deployed at `https://www.foobar.com/my-app/`, set `baseUrl` to `'/my-app/'`. + By default, Vue CLI assumes your app will be deployed at the root of a domain, e.g. `https://www.my-app.com/`. If your app is deployed at a sub-path, you will need to specify that sub-path using this option. For example, if your app is deployed at `https://www.foobar.com/my-app/`, set `publicPath` to `'/my-app/'`. The value can also be set to an empty string (`''`) or a relative path (`./`) so that all assets are linked using relative paths. This allows the built bundle to be deployed under any public path, or used in a file system based environment like a Cordova hybrid app. - ::: warning Limitations of relative baseUrl - Relative `baseUrl` has some limitations and should be avoided when: + ::: warning Limitations of relative publicPath + Relative `publicPath` has some limitations and should be avoided when: - You are using HTML5 `history.pushState` routing; @@ -52,7 +56,7 @@ module.exports = { ``` js module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/production-sub-path/' : '/' } @@ -304,7 +308,7 @@ module.exports = { - Some values like `host`, `port` and `https` may be overwritten by command line flags. - - Some values like `publicPath` and `historyApiFallback` should not be modified as they need to be synchronized with [baseUrl](#baseurl) for the dev server to function properly. + - Some values like `publicPath` and `historyApiFallback` should not be modified as they need to be synchronized with [publicPath](#baseurl) for the dev server to function properly. ### devServer.proxy diff --git a/docs/guide/deployment.md b/docs/guide/deployment.md index 5bcc5efe30..4b21524660 100644 --- a/docs/guide/deployment.md +++ b/docs/guide/deployment.md @@ -4,11 +4,11 @@ If you are using Vue CLI along with a backend framework that handles static assets as part of its deployment, all you need to do is make sure Vue CLI generates the built files in the correct location, and then follow the deployment instruction of your backend framework. -If you are developing your frontend app separately from your backend - i.e. your backend exposes an API for your frontend to talk to, then your frontend is essentially a purely static app. You can deploy the built content in the `dist` directory to any static file server, but make sure to set the correct [baseUrl](../config/#baseurl). +If you are developing your frontend app separately from your backend - i.e. your backend exposes an API for your frontend to talk to, then your frontend is essentially a purely static app. You can deploy the built content in the `dist` directory to any static file server, but make sure to set the correct [publicPath](../config/#publicpath). ### Previewing Locally -The `dist` directory is meant to be served by an HTTP server (unless you've configured `baseUrl` to be a relative value), so it will not work if you open `dist/index.html` directly over `file://` protocol. The easiest way to preview your production build locally is using a Node.js static file server, for example [serve](https://github.com/zeit/serve): +The `dist` directory is meant to be served by an HTTP server (unless you've configured `publicPath` to be a relative value), so it will not work if you open `dist/index.html` directly over `file://` protocol. The easiest way to preview your production build locally is using a Node.js static file server, for example [serve](https://github.com/zeit/serve): ``` bash npm install -g serve @@ -35,15 +35,15 @@ If you are using the PWA plugin, your app must be served over HTTPS so that [Ser ### GitHub Pages -1. Set correct `baseUrl` in `vue.config.js`. +1. Set correct `publicPath` in `vue.config.js`. - If you are deploying to `https://.github.io/`, you can omit `baseUrl` as it defaults to `"/"`. + If you are deploying to `https://.github.io/`, you can omit `publicPath` as it defaults to `"/"`. - If you are deploying to `https://.github.io//`, (i.e. your repository is at `https://github.com//`), set `baseUrl` to `"//"`. For example, if your repo name is "my-project", your `vue.config.js` should look like this: + If you are deploying to `https://.github.io//`, (i.e. your repository is at `https://github.com//`), set `publicPath` to `"//"`. For example, if your repo name is "my-project", your `vue.config.js` should look like this: ``` js module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/my-project/' : '/' } @@ -112,7 +112,7 @@ Typically, your static website will be hosted on https://yourUserName.gitlab.io/ // make sure you update `yourProjectName` with the name of your GitLab project module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/yourProjectName/' : '/' } @@ -291,11 +291,11 @@ Verify your project is successfully published by Surge by visiting `myawesomepro 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 `.bitbucket.io`. -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 `baseUrl` in `vue.config.js`. +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`. - If you are deploying to `https://.bitbucket.io/`, you can omit `baseUrl` as it defaults to `"/"`. + If you are deploying to `https://.bitbucket.io/`, you can omit `publicPath` as it defaults to `"/"`. - If you are deploying to `https://.bitbucket.io//`, set `baseUrl` to `"//"`. In this case the directory structure of the repository should reflect the url structure, for instance the repository should have a `/` directory. + If you are deploying to `https://.bitbucket.io//`, set `publicPath` to `"//"`. In this case the directory structure of the repository should reflect the url structure, for instance the repository should have a `/` directory. 3. Inside your project, create `deploy.sh` with the following content and run it to deploy: diff --git a/docs/guide/html-and-static-assets.md b/docs/guide/html-and-static-assets.md index 08616e6bec..9636445404 100644 --- a/docs/guide/html-and-static-assets.md +++ b/docs/guide/html-and-static-assets.md @@ -21,7 +21,7 @@ In addition to the [default values exposed by `html-webpack-plugin`](https://git ``` See also: -- [baseUrl](../config/#baseurl) +- [publicPath](../config/#publicpath) ### Preload @@ -166,7 +166,7 @@ Note we recommend importing assets as part of your module dependency graph so th - Missing files cause compilation errors instead of 404 errors for your users. - Result filenames include content hashes so you don’t need to worry about browsers caching their old versions. -The `public` directory is provided as an **escape hatch**, and when you reference it via absolute path, you need to take into account where your app will be deployed. If your app is not deployed at the root of a domain, you will need to prefix your URLs with the [baseUrl](../config/#baseurl): +The `public` directory is provided as an **escape hatch**, and when you reference it via absolute path, you need to take into account where your app will be deployed. If your app is not deployed at the root of a domain, you will need to prefix your URLs with the [publicPath](../config/#publicpath): - In `public/index.html` or other HTML files used as templates by `html-webpack-plugin`, you need to prefix the link with `<%= BASE_URL %>`: @@ -179,7 +179,7 @@ The `public` directory is provided as an **escape hatch**, and when you referenc ``` js data () { return { - baseUrl: process.env.BASE_URL + publicPath: process.env.BASE_URL } } ``` @@ -187,7 +187,7 @@ The `public` directory is provided as an **escape hatch**, and when you referenc Then: ``` html - + ``` ### When to use the `public` folder diff --git a/docs/guide/mode-and-env.md b/docs/guide/mode-and-env.md index 47c1bbfdf9..94fcbc9404 100644 --- a/docs/guide/mode-and-env.md +++ b/docs/guide/mode-and-env.md @@ -81,7 +81,7 @@ During build, `process.env.VUE_APP_SECRET` will be replaced by the corresponding In addition to `VUE_APP_*` variables, there are also two special variables that will always be available in your app code: - `NODE_ENV` - this will be one of `"development"`, `"production"` or `"test"` depending on the [mode](#modes) the app is running in. -- `BASE_URL` - this corresponds to the `baseUrl` option in `vue.config.js` and is the base path your app is deployed at. +- `BASE_URL` - this corresponds to the `publicPath` option in `vue.config.js` and is the base path your app is deployed at. All resolved env variables will be available inside `public/index.html` as discussed in [HTML - Interpolation](./html-and-static-assets.md#interpolation). diff --git a/docs/guide/webpack.md b/docs/guide/webpack.md index 28443ce0a0..b59f123bca 100644 --- a/docs/guide/webpack.md +++ b/docs/guide/webpack.md @@ -18,7 +18,7 @@ module.exports = { The object will be merged into the final webpack config using [webpack-merge](https://github.com/survivejs/webpack-merge). ::: warning -Some webpack options are set based on values in `vue.config.js` and should not be mutated directly. For example, instead of modifying `output.path`, you should use the `outputDir` option in `vue.config.js`; instead of modifying `output.publicPath`, you should use the `baseUrl` option in `vue.config.js`. This is because the values in `vue.config.js` will be used in multiple places inside the config to ensure everything works properly together. +Some webpack options are set based on values in `vue.config.js` and should not be mutated directly. For example, instead of modifying `output.path`, you should use the `outputDir` option in `vue.config.js`; instead of modifying `output.publicPath`, you should use the `publicPath` option in `vue.config.js`. This is because the values in `vue.config.js` will be used in multiple places inside the config to ensure everything works properly together. ::: If you need conditional behavior based on the environment, or want to directly mutate the config, use a function (which will be lazy evaluated after the env variables are set). The function receives the resolved config as the argument. Inside the function, you can either mutate the config directly, OR return an object which will be merged: diff --git a/docs/ru/config/README.md b/docs/ru/config/README.md index 90ad9c6345..ff2778775d 100644 --- a/docs/ru/config/README.md +++ b/docs/ru/config/README.md @@ -29,19 +29,19 @@ module.exports = { } ``` -### baseUrl +### publicPath - Тип: `string` - По умолчанию: `'/'` - Базовый URL-адрес сборки вашего приложения, по которому оно будет опубликовано. Это аналог опции webpack `output.publicPath`, но Vue CLI также использует это значение в других целях, поэтому вы должны **всегда использовать `baseUrl` вместо изменения опции `output.publicPath`**. + Базовый URL-адрес сборки вашего приложения, по которому оно будет опубликовано. Это аналог опции webpack `output.publicPath`, но Vue CLI также использует это значение в других целях, поэтому вы должны **всегда использовать `publicPath` вместо изменения опции `output.publicPath`**. - По умолчанию Vue CLI считает, что публикация будет выполнена в корень домена, например `https://www.my-app.com/`. Если приложение публикуется в подкаталог, то необходимо указать этот путь с помощью этой опции. Например, если приложение будет публиковаться по адресу `https://www.foobar.com/my-app/`, установите `baseUrl` в значение `'/my-app/'`. + По умолчанию Vue CLI считает, что публикация будет выполнена в корень домена, например `https://www.my-app.com/`. Если приложение публикуется в подкаталог, то необходимо указать этот путь с помощью этой опции. Например, если приложение будет публиковаться по адресу `https://www.foobar.com/my-app/`, установите `publicPath` в значение `'/my-app/'`. Значение также может быть пустой строкой (`''`) или относительным путём (`./`), чтобы все ресурсы подключались через относительные пути. Это позволит публиковать сборку в любой публичный каталог, или использовать в окружении файловой системы, например в гибридном приложении Cordova. - ::: warning Ограничения относительного baseUrl - Относительный `baseUrl` имеет некоторые ограничения и его следует избегать если: + ::: warning Ограничения относительного publicPath + Относительный `publicPath` имеет некоторые ограничения и его следует избегать если: - Вы используете маршрутизацию HTML5 `history.pushState`; @@ -52,7 +52,7 @@ module.exports = { ``` js module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/production-sub-path/' : '/' } @@ -304,7 +304,7 @@ module.exports = { - Некоторые значения, такие как `host`, `port` и `https`, могут перезаписываться флагами командной строки. - - Некоторые значения, такие как `publicPath` и `historyApiFallback`, нельзя изменять, поскольку они должны быть синхронизированы с [baseUrl](#baseurl) для правильной работы сервера разработки. + - Некоторые значения, такие как `publicPath` и `historyApiFallback`, нельзя изменять, поскольку они должны быть синхронизированы с [publicPath](#baseurl) для правильной работы сервера разработки. ### devServer.proxy diff --git a/docs/ru/guide/deployment.md b/docs/ru/guide/deployment.md index fde5dd1e78..a1c2bf7e46 100644 --- a/docs/ru/guide/deployment.md +++ b/docs/ru/guide/deployment.md @@ -4,11 +4,11 @@ Если вы используете Vue CLI с бэкенд-фреймворком, который обрабатывает статические ресурсы, как часть своей публикации, всё что вам нужно сделать, это убедиться, что Vue CLI генерирует файлы сборки в правильном месте, а затем следуйте инструкциям по публикации вашего бэкенд-фреймворка. -Если вы разрабатываете фронтенд вашего приложения отдельно от бэкенда — т.е. ваш бэкенд предоставляет только API с которым вы работаете, то по сути ваш фронтенд является чисто статическим приложением. Вы можете публиковать собранный контент в каталоге `dist` на любой статический файловый сервер, главное не забудьте установить правильный [baseUrl](../config/#baseurl). +Если вы разрабатываете фронтенд вашего приложения отдельно от бэкенда — т.е. ваш бэкенд предоставляет только API с которым вы работаете, то по сути ваш фронтенд является чисто статическим приложением. Вы можете публиковать собранный контент в каталоге `dist` на любой статический файловый сервер, главное не забудьте установить правильный [publicPath](../config/#publicpath). ### Локальный предпросмотр -Каталог `dist` предназначен для обслуживания HTTP-сервером (если не задали `baseUrl` относительным значением), поэтому не сработает если напрямую открыть `dist/index.html` через `file://` протокол. Самый простой способ предпросмотра вашей сборки для production локально — использовать статический файловый сервер Node.js, например [serve](https://github.com/zeit/serve): +Каталог `dist` предназначен для обслуживания HTTP-сервером (если не задали `publicPath` относительным значением), поэтому не сработает если напрямую открыть `dist/index.html` через `file://` протокол. Самый простой способ предпросмотра вашей сборки для production локально — использовать статический файловый сервер Node.js, например [serve](https://github.com/zeit/serve): ``` bash npm install -g serve @@ -35,15 +35,15 @@ serve -s dist ### GitHub Pages -1. Установите корректное значение `baseUrl` в `vue.config.js`. +1. Установите корректное значение `publicPath` в `vue.config.js`. - Если вы публикуете по адресу `https://.github.io/`, вы можете опустить `baseUrl`, так как оно по умолчанию `"/"`. + Если вы публикуете по адресу `https://.github.io/`, вы можете опустить `publicPath`, так как оно по умолчанию `"/"`. - Если вы публикуете по адресу `https://.github.io//`, (т.е. ваш репозиторий находится по адресу `https://github.com//`), установите `baseUrl` в значение `"//"`. Например, если ваш репозиторий называется "my-project", то ваш `vue.config.js` будет выглядеть примерно так: + Если вы публикуете по адресу `https://.github.io//`, (т.е. ваш репозиторий находится по адресу `https://github.com//`), установите `publicPath` в значение `"//"`. Например, если ваш репозиторий называется "my-project", то ваш `vue.config.js` будет выглядеть примерно так: ``` js module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/my-project/' : '/' } @@ -112,7 +112,7 @@ pages: # задание должно быть именованными стра // убедитесь, что обновили `yourProjectName` на имя вашего проекта GitLab module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/yourProjectName/' : '/' } @@ -282,11 +282,11 @@ npm install --global surge 1. Как описывается в [документации Bitbucket](https://confluence.atlassian.com/bitbucket/publishing-a-website-on-bitbucket-cloud-221449776.html) вам необходимо создать репозиторий названный в точности `.bitbucket.io`. -2. Возможно публиковать в подкаталог, например, если требуется иметь несколько веб-сайтов. В этом случае укажите корректный `baseUrl` в файле `vue.config.js`. +2. Возможно публиковать в подкаталог, например, если требуется иметь несколько веб-сайтов. В этом случае укажите корректный `publicPath` в файле `vue.config.js`. - Если публикуете по адресу `https://.bitbucket.io/`, установку `baseUrl` можно опустить, поскольку значение по умолчанию `"/"`. + Если публикуете по адресу `https://.bitbucket.io/`, установку `publicPath` можно опустить, поскольку значение по умолчанию `"/"`. - Если публикуете по адресу `https://.bitbucket.io//`, нужно задать `baseUrl` в значение `"//"`. В этом случае структура каталогов должна отражать структуру URL-адресов, например, репозиторий должен иметь каталог `/`. + Если публикуете по адресу `https://.bitbucket.io//`, нужно задать `publicPath` в значение `"//"`. В этом случае структура каталогов должна отражать структуру URL-адресов, например, репозиторий должен иметь каталог `/`. 3. В проекте создайте `deploy.sh` с указанным содержимым и запустите его для публикации: diff --git a/docs/ru/guide/html-and-static-assets.md b/docs/ru/guide/html-and-static-assets.md index 5ee74efa37..881b7b7f37 100644 --- a/docs/ru/guide/html-and-static-assets.md +++ b/docs/ru/guide/html-and-static-assets.md @@ -21,7 +21,7 @@ ``` См. также: -- [baseUrl](../config/#baseurl) +- [publicPath](../config/#publicpath) ### Preload @@ -166,7 +166,7 @@ module.exports = { - Недостающие файлы вызывают ошибку сборки вместо ошибок 404 для пользователей. - Имена файлов в результате будут с хэшем, поэтому не нужно беспокоиться о том, что браузеры используют старые версии из кэша. -Каталог `public` предоставляется для **крайних случаев**, поэтому, когда вы ссылаетесь на него по абсолютному пути, необходимо учитывать, где будет опубликовано ваше приложение. Если публикуется не в корне домена, нужно указать префикс для URL-адресов в [baseUrl](../config/#baseurl): +Каталог `public` предоставляется для **крайних случаев**, поэтому, когда вы ссылаетесь на него по абсолютному пути, необходимо учитывать, где будет опубликовано ваше приложение. Если публикуется не в корне домена, нужно указать префикс для URL-адресов в [publicPath](../config/#publicpath): - В `public/index.html` или других HTML-файлах, используемых `html-webpack-plugin` в качестве шаблонов, необходимо добавлять префикс в ссылки с помощью `<%= BASE_URL %>`: @@ -179,7 +179,7 @@ module.exports = { ``` js data () { return { - baseUrl: process.env.BASE_URL + publicPath: process.env.BASE_URL } } ``` @@ -187,7 +187,7 @@ module.exports = { А затем использовать в шаблоне: ``` html - + ``` ### Когда использовать каталог `public` diff --git a/docs/ru/guide/mode-and-env.md b/docs/ru/guide/mode-and-env.md index be7df086ea..c6a8576674 100644 --- a/docs/ru/guide/mode-and-env.md +++ b/docs/ru/guide/mode-and-env.md @@ -80,7 +80,7 @@ console.log(process.env.VUE_APP_SECRET) В дополнение к переменным `VUE_APP_*` также есть две специальные переменные, которые всегда доступны в коде вашего приложения: - `NODE_ENV` — значение будет `"development"`, `"production"` или `"test"` в зависимости от [режима работы](#режимы-работы) в котором работает приложение. -- `BASE_URL` — соответствует опции `baseUrl` в `vue.config.js` и определяет базовый путь по которому опубликовано ваше приложение. +- `BASE_URL` — соответствует опции `publicPath` в `vue.config.js` и определяет базовый путь по которому опубликовано ваше приложение. Все разрешённые переменные окружения также будут доступны внутри `public/index.html` как обсуждалось ранее в разделе [HTML - Интерполяции](./html-and-static-assets.md#интерпоnяции). diff --git a/docs/ru/guide/webpack.md b/docs/ru/guide/webpack.md index f378f7446c..1f1ed5896e 100644 --- a/docs/ru/guide/webpack.md +++ b/docs/ru/guide/webpack.md @@ -18,7 +18,7 @@ module.exports = { Объект будет объединён в итоговую конфигурацию webpack с помощью [webpack-merge](https://github.com/survivejs/webpack-merge). ::: warning Предупреждение -Некоторые параметры webpack устанавливаются на основе значений из `vue.config.js` и не должны изменяться напрямую. Например, вместо изменения `output.path` нужно использовать опцию `outputDir` в `vue.config.js`; а вместо `output.publicPath` нужно использовать опцию `baseUrl` в `vue.config.js`. Это связано с тем, что значения из `vue.config.js` используются в нескольких местах внутри конфигурации и необходимо гарантировать что всё вместе будет работать правильно. +Некоторые параметры webpack устанавливаются на основе значений из `vue.config.js` и не должны изменяться напрямую. Например, вместо изменения `output.path` нужно использовать опцию `outputDir` в `vue.config.js`; а вместо `output.publicPath` нужно использовать опцию `publicPath` в `vue.config.js`. Это связано с тем, что значения из `vue.config.js` используются в нескольких местах внутри конфигурации и необходимо гарантировать что всё вместе будет работать правильно. ::: Если необходимо условное поведение, в зависимости от окружения, или вы хотите напрямую изменять конфигурацию — используйте функцию (будет лениво выполняться после установки переменных окружения). Она получает итоговую конфигурацию в качестве аргумента. Внутри функции можно напрямую изменить конфигурацию, ИЛИ вернуть объект для объединения: diff --git a/docs/zh/config/README.md b/docs/zh/config/README.md index 4f2eb93b60..d7abcc0ad7 100644 --- a/docs/zh/config/README.md +++ b/docs/zh/config/README.md @@ -27,19 +27,19 @@ module.exports = { } ``` -### baseUrl +### publicPath - Type: `string` - Default: `'/'` - 部署应用包时的基本 URL。用法和 webpack 本身的 `output.publicPath` 一致，但是 Vue CLI 在一些其他地方也需要用到这个值，所以**请始终使用 `baseUrl` 而不要直接修改 webpack 的 `output.publicPath`**。 + 部署应用包时的基本 URL。用法和 webpack 本身的 `output.publicPath` 一致，但是 Vue CLI 在一些其他地方也需要用到这个值，所以**请始终使用 `publicPath` 而不要直接修改 webpack 的 `output.publicPath`**。 - 默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上，例如 `https://www.my-app.com/`。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 `https://www.my-app.com/my-app/`，则设置 `baseUrl` 为 `/my-app/`。 + 默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上，例如 `https://www.my-app.com/`。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 `https://www.my-app.com/my-app/`，则设置 `publicPath` 为 `/my-app/`。 这个值也可以被设置为空字符串 (`''`) 或是相对路径 (`'./'`)，这样所有的资源都会被链接为相对路径，这样打出来的包可以被部署在任意路径，也可以用在类似 Cordova hybrid 应用的文件系统中。 - ::: warning 相对 baseUrl 的限制 - 相对路径的 `baseUrl` 有一些使用上的限制。在以下情况下，应当避免使用相对 `baseUrl`: + ::: warning 相对 publicPath 的限制 + 相对路径的 `publicPath` 有一些使用上的限制。在以下情况下，应当避免使用相对 `publicPath`: - 当使用基于 HTML5 `history.pushState` 的路由时； @@ -50,7 +50,7 @@ module.exports = { ``` js module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/production-sub-path/' : '/' } @@ -302,7 +302,7 @@ module.exports = { - 有些值像 `host`、`port` 和 `https` 可能会被命令行参数覆写。 - - 有些值像 `publicPath` 和 `historyApiFallback` 不应该被修改，因为它们需要和开发服务器的 [baseUrl](#baseurl) 同步以保障正常的工作。 + - 有些值像 `publicPath` 和 `historyApiFallback` 不应该被修改，因为它们需要和开发服务器的 [publicPath](#baseurl) 同步以保障正常的工作。 ### devServer.proxy diff --git a/docs/zh/guide/deployment.md b/docs/zh/guide/deployment.md index 8f646d00e2..672c653bd3 100644 --- a/docs/zh/guide/deployment.md +++ b/docs/zh/guide/deployment.md @@ -4,11 +4,11 @@ 如果你用 Vue CLI 处理静态资源并和后端框架一起作为部署的一部分，那么你需要的仅仅是确保 Vue CLI 生成的构建文件在正确的位置，并遵循后端框架的发布方式即可。 -如果你独立于后端部署前端应用——也就是说后端暴露一个前端可访问的 API，然后前端实际上是纯静态应用。那么你可以将 `dist` 目录里构建的内容部署到任何静态文件服务器中，但要确保正确的 [baseUrl](../config/#baseurl)。 +如果你独立于后端部署前端应用——也就是说后端暴露一个前端可访问的 API，然后前端实际上是纯静态应用。那么你可以将 `dist` 目录里构建的内容部署到任何静态文件服务器中，但要确保正确的 [publicPath](../config/#publicpath)。 ### 本地预览 -`dist` 目录需要启动一个 HTTP 服务器来访问 (除非你已经将 `baseUrl` 配置为了一个相对的值)，所以以 `file://` 协议直接打开 `dist/index.html` 是不会工作的。在本地预览生产环境构建最简单的方式就是使用一个 Node.js 静态文件服务器，例如 [serve](https://github.com/zeit/serve)： +`dist` 目录需要启动一个 HTTP 服务器来访问 (除非你已经将 `publicPath` 配置为了一个相对的值)，所以以 `file://` 协议直接打开 `dist/index.html` 是不会工作的。在本地预览生产环境构建最简单的方式就是使用一个 Node.js 静态文件服务器，例如 [serve](https://github.com/zeit/serve)： ``` bash npm install -g serve @@ -39,15 +39,15 @@ serve -s dist ### GitHub Pages -1. Set correct `baseUrl` in `vue.config.js`. +1. Set correct `publicPath` in `vue.config.js`. - If you are deploying to `https://.github.io/`, you can omit `baseUrl` as it defaults to `"/"`. + If you are deploying to `https://.github.io/`, you can omit `publicPath` as it defaults to `"/"`. - If you are deploying to `https://.github.io//`, (i.e. your repository is at `https://github.com//`), set `baseUrl` to `"//"`. For example, if your repo name is "my-project", your `vue.config.js` should look like this: + If you are deploying to `https://.github.io//`, (i.e. your repository is at `https://github.com//`), set `publicPath` to `"//"`. For example, if your repo name is "my-project", your `vue.config.js` should look like this: ``` js module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/my-project/' : '/' } @@ -116,7 +116,7 @@ Typically, your static website will be hosted on https://yourUserName.gitlab.io/ // make sure you update `yourProjectName` with the name of your GitLab project module.exports = { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? '/yourProjectName/' : '/' } @@ -282,11 +282,11 @@ Verify your project is successfully published by Surge by visiting `myawesomepro 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 `.bitbucket.io`. -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 `baseUrl` in `vue.config.js`. +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`. - If you are deploying to `https://.bitbucket.io/`, you can omit `baseUrl` as it defaults to `"/"`. + If you are deploying to `https://.bitbucket.io/`, you can omit `publicPath` as it defaults to `"/"`. - If you are deploying to `https://.bitbucket.io//`, set `baseUrl` to `"//"`. In this case the directory structure of the repository should reflect the url structure, for instance the repository should have a `/` directory. + If you are deploying to `https://.bitbucket.io//`, set `publicPath` to `"//"`. In this case the directory structure of the repository should reflect the url structure, for instance the repository should have a `/` directory. 3. Inside your project, create `deploy.sh` with the following content and run it to deploy: diff --git a/docs/zh/guide/html-and-static-assets.md b/docs/zh/guide/html-and-static-assets.md index e1a7d2be02..0f9d51c8d8 100644 --- a/docs/zh/guide/html-and-static-assets.md +++ b/docs/zh/guide/html-and-static-assets.md @@ -21,7 +21,7 @@ ``` 更多内容可以查阅： -- [baseUrl](../config/#baseurl) +- [publicPath](../config/#publicpath) ### Preload @@ -166,7 +166,7 @@ module.exports = { - 文件丢失会直接在编译时报错，而不是到了用户端才产生 404 错误。 - 最终生成的文件名包含了内容哈希，因此你不必担心浏览器会缓存它们的老版本。 -`public` 目录提供的是一个**应急手段**，当你通过绝对路径引用它时，留意应用将会部署到哪里。如果你的应用没有部署在域名的根部，那么你需要为你的 URL 配置 [baseUrl](../config/#baseurl) 前缀： +`public` 目录提供的是一个**应急手段**，当你通过绝对路径引用它时，留意应用将会部署到哪里。如果你的应用没有部署在域名的根部，那么你需要为你的 URL 配置 [publicPath](../config/#publicpath) 前缀： - 在 `public/index.html` 或其它通过 `html-webpack-plugin` 用作模板的 HTML 文件中，你需要通过 `<%= BASE_URL %>` 设置链接前缀： @@ -179,7 +179,7 @@ module.exports = { ``` js data () { return { - baseUrl: process.env.BASE_URL + publicPath: process.env.BASE_URL } } ``` @@ -187,7 +187,7 @@ module.exports = { 然后： ``` html - + ``` ### 何时使用 `public` 文件夹 diff --git a/docs/zh/guide/mode-and-env.md b/docs/zh/guide/mode-and-env.md index cba69be344..c1b5a18947 100644 --- a/docs/zh/guide/mode-and-env.md +++ b/docs/zh/guide/mode-and-env.md @@ -81,7 +81,7 @@ console.log(process.env.VUE_APP_SECRET) 除了 `VUE_APP_*` 变量之外，在你的应用代码中始终可用的还有两个特殊的变量： - `NODE_ENV` - 会是 `"development"`、`"production"` 或 `"test"` 中的一个。具体的值取决于应用运行的[模式](#模式)。 -- `BASE_URL` - 会和 `vue.config.js` 中的 `baseUrl` 选项相符，即你的应用会部署到的基础路径。 +- `BASE_URL` - 会和 `vue.config.js` 中的 `publicPath` 选项相符，即你的应用会部署到的基础路径。 所有解析出来的环境变量都可以在 `public/index.html` 中以 [HTML 插值](./html-and-static-assets.md#插值)中介绍的方式使用。 diff --git a/docs/zh/guide/webpack.md b/docs/zh/guide/webpack.md index 10ea3e37e4..5f52620491 100644 --- a/docs/zh/guide/webpack.md +++ b/docs/zh/guide/webpack.md @@ -18,7 +18,7 @@ module.exports = { 该对象将会被 [webpack-merge](https://github.com/survivejs/webpack-merge) 合并入最终的 webpack 配置。 ::: warning 警告 -有些 webpack 选项是基于 `vue.config.js` 中的值设置的，所以不能直接修改。例如你应该修改 `vue.config.js` 中的 `outputDir` 选项而不是修改 `output.path`；你应该修改 `vue.config.js` 中的 `baseUrl` 选项而不是修改 `output.publicPath`。这样做是因为 `vue.config.js` 中的值会被用在配置里的多个地方，以确保所有的部分都能正常工作在一起。 +有些 webpack 选项是基于 `vue.config.js` 中的值设置的，所以不能直接修改。例如你应该修改 `vue.config.js` 中的 `outputDir` 选项而不是修改 `output.path`；你应该修改 `vue.config.js` 中的 `publicPath` 选项而不是修改 `output.publicPath`。这样做是因为 `vue.config.js` 中的值会被用在配置里的多个地方，以确保所有的部分都能正常工作在一起。 ::: 如果你需要基于环境有条件地配置行为，或者想要直接修改配置，那就换成一个函数 (该函数会在环境变量被设置之后懒执行)。该方法的第一个参数会收到已经解析好的配置。在函数内，你可以直接修改配置，或者返回一个将会被合并的对象： diff --git a/packages/@vue/cli-service/__tests__/Service.spec.js b/packages/@vue/cli-service/__tests__/Service.spec.js index 3db8ae81ea..6f08cdf811 100644 --- a/packages/@vue/cli-service/__tests__/Service.spec.js +++ b/packages/@vue/cli-service/__tests__/Service.spec.js @@ -6,6 +6,8 @@ const fs = require('fs') const path = require('path') const Service = require('../lib/Service') +const { logs } = require('@vue/cli-shared-utils') + const mockPkg = json => { fs.writeFileSync('/package.json', JSON.stringify(json, null, 2)) } @@ -82,36 +84,59 @@ test('load project options from package.json', () => { expect(service.projectOptions.lintOnSave).toBe(true) }) -test('handle option baseUrl and outputDir correctly', () => { +test('deprecate baseUrl', () => { + mockPkg({ + vue: { + baseUrl: './foo/bar' + } + }) + createMockService() + expect(logs.warn.some(([msg]) => msg.match('is deprecated now, please use "publicPath" instead.'))) +}) + +test('discard baseUrl if publicPath also exists', () => { mockPkg({ vue: { - baseUrl: 'https://foo.com/bar', + baseUrl: '/foo/barbase/', + publicPath: '/foo/barpublic/' + } + }) + + const service = createMockService() + expect(logs.warn.some(([msg]) => msg.match('"baseUrl" will be ignored in favor of "publicPath"'))) + expect(service.projectOptions.publicPath).toBe('/foo/barpublic/') +}) + +test('handle option publicPath and outputDir correctly', () => { + mockPkg({ + vue: { + publicPath: 'https://foo.com/bar', outputDir: '/public/' } }) const service = createMockService() - expect(service.projectOptions.baseUrl).toBe('https://foo.com/bar/') + expect(service.projectOptions.publicPath).toBe('https://foo.com/bar/') expect(service.projectOptions.outputDir).toBe('/public') }) -test('normalize baseUrl when relative', () => { +test('normalize publicPath when relative', () => { mockPkg({ vue: { - baseUrl: './foo/bar' + publicPath: './foo/bar' } }) const service = createMockService() - expect(service.projectOptions.baseUrl).toBe('foo/bar/') + expect(service.projectOptions.publicPath).toBe('foo/bar/') }) -test('keep baseUrl when empty', () => { +test('keep publicPath when empty', () => { mockPkg({ vue: { - baseUrl: '' + publicPath: '' } }) const service = createMockService() - expect(service.projectOptions.baseUrl).toBe('') + expect(service.projectOptions.publicPath).toBe('') }) test('load project options from vue.config.js', () => { diff --git a/packages/@vue/cli-service/lib/Service.js b/packages/@vue/cli-service/lib/Service.js index 668a65d631..c03bbc7ace 100644 --- a/packages/@vue/cli-service/lib/Service.js +++ b/packages/@vue/cli-service/lib/Service.js @@ -260,11 +260,11 @@ module.exports = class Service { if ( !process.env.VUE_CLI_TEST && (target && target !== 'app') && - config.output.publicPath !== this.projectOptions.baseUrl + config.output.publicPath !== this.projectOptions.publicPath ) { throw new Error( `Do not modify webpack output.publicPath directly. ` + - `Use the "baseUrl" option in vue.config.js instead.` + `Use the "publicPath" option in vue.config.js instead.` ) } @@ -324,10 +324,29 @@ module.exports = class Service { resolvedFrom = 'inline options' } + if (typeof resolved.baseUrl !== 'undefined') { + if (typeof resolved.publicPath !== 'undefined') { + warn( + `You have set both "baseUrl" and "publicPath" in ${chalk.bold('vue.config.js')}, ` + + `in this case, "baseUrl" will be ignored in favor of "publicPath".` + ) + } else { + warn( + `"baseUrl" option in ${chalk.bold('vue.config.js')} ` + + `is deprecated now, please use "publicPath" instead.` + ) + resolved.publicPath = resolved.baseUrl + } + } + + // if (typeof resolved.publicPath === 'undefined') { + // resolved.publicPath = '/' + // } + // normalize some options - ensureSlash(resolved, 'baseUrl') - if (typeof resolved.baseUrl === 'string') { - resolved.baseUrl = resolved.baseUrl.replace(/^\.\//, '') + ensureSlash(resolved, 'publicPath') + if (typeof resolved.publicPath === 'string') { + resolved.publicPath = resolved.publicPath.replace(/^\.\//, '') } removeSlash(resolved, 'outputDir') diff --git a/packages/@vue/cli-service/lib/commands/serve.js b/packages/@vue/cli-service/lib/commands/serve.js index 24b5b03ec9..a871ce348d 100644 --- a/packages/@vue/cli-service/lib/commands/serve.js +++ b/packages/@vue/cli-service/lib/commands/serve.js @@ -90,7 +90,7 @@ module.exports = (api, options) => { protocol, host, port, - isAbsoluteUrl(options.baseUrl) ? '/' : options.baseUrl + isAbsoluteUrl(options.publicPath) ? '/' : options.publicPath ) const proxySettings = prepareProxy( @@ -105,7 +105,7 @@ module.exports = (api, options) => { ? `?${publicUrl}/sockjs-node` : isInContainer // can't infer public netowrk url if inside a container... - // use client-side inference (note this would break with non-root baseUrl) + // use client-side inference (note this would break with non-root publicPath) ? `` // otherwise infer the url : `?` + url.format({ @@ -140,7 +140,7 @@ module.exports = (api, options) => { historyApiFallback: { disableDotRule: true, rewrites: [ - { from: /./, to: path.posix.join(options.baseUrl, 'index.html') } + { from: /./, to: path.posix.join(options.publicPath, 'index.html') } ] }, contentBase: api.resolve('public'), @@ -148,7 +148,7 @@ module.exports = (api, options) => { hot: !isProduction, quiet: true, compress: isProduction, - publicPath: options.baseUrl, + publicPath: options.publicPath, overlay: isProduction // TODO disable this ? false : { warnings: false, errors: true } @@ -216,15 +216,15 @@ module.exports = (api, options) => { } else { console.log() console.log(chalk.yellow(` It seems you are running Vue CLI inside a container.`)) - if (!publicUrl && options.baseUrl && options.baseUrl !== '/') { + if (!publicUrl && options.publicPath && options.publicPath !== '/') { console.log() - console.log(chalk.yellow(` Since you are using a non-root baseUrl, the hot-reload socket`)) + console.log(chalk.yellow(` Since you are using a non-root publicPath, the hot-reload socket`)) console.log(chalk.yellow(` will not be able to infer the correct URL to connect. You should`)) console.log(chalk.yellow(` explicitly specify the URL via ${chalk.blue(`devServer.public`)}.`)) console.log() } console.log(chalk.yellow(` Access the dev server via ${chalk.cyan( - `${protocol}://localhost:${options.baseUrl}` + `${protocol}://localhost:${options.publicPath}` )}`)) } console.log() diff --git a/packages/@vue/cli-service/lib/config/app.js b/packages/@vue/cli-service/lib/config/app.js index ba72db29aa..985748514b 100644 --- a/packages/@vue/cli-service/lib/config/app.js +++ b/packages/@vue/cli-service/lib/config/app.js @@ -268,7 +268,7 @@ module.exports = (api, options) => { .use(require('../webpack/CorsPlugin'), [{ crossorigin: options.crossorigin, integrity: options.integrity, - baseUrl: options.baseUrl + publicPath: options.publicPath }]) } diff --git a/packages/@vue/cli-service/lib/config/base.js b/packages/@vue/cli-service/lib/config/base.js index f2f8ec58c7..5924eded39 100644 --- a/packages/@vue/cli-service/lib/config/base.js +++ b/packages/@vue/cli-service/lib/config/base.js @@ -34,7 +34,7 @@ module.exports = (api, options) => { .output .path(api.resolve(options.outputDir)) .filename(isLegacyBundle ? '[name]-legacy.js' : '[name].js') - .publicPath(options.baseUrl) + .publicPath(options.publicPath) webpackConfig.resolve .extensions diff --git a/packages/@vue/cli-service/lib/config/dev.js b/packages/@vue/cli-service/lib/config/dev.js index 9eca4b6910..cae4cd4525 100644 --- a/packages/@vue/cli-service/lib/config/dev.js +++ b/packages/@vue/cli-service/lib/config/dev.js @@ -4,7 +4,7 @@ module.exports = (api, options) => { webpackConfig .devtool('cheap-module-eval-source-map') .output - .publicPath(options.baseUrl) + .publicPath(options.publicPath) webpackConfig .plugin('hmr') diff --git a/packages/@vue/cli-service/lib/options.js b/packages/@vue/cli-service/lib/options.js index 9c783eb4ac..946abc70f0 100644 --- a/packages/@vue/cli-service/lib/options.js +++ b/packages/@vue/cli-service/lib/options.js @@ -2,6 +2,7 @@ const { createSchema, validate } = require('@vue/cli-shared-utils') const schema = createSchema(joi => joi.object({ baseUrl: joi.string().allow(''), + publicPath: joi.string().allow(''), outputDir: joi.string(), assetsDir: joi.string().allow(''), indexPath: joi.string(), @@ -69,7 +70,7 @@ function hasMultipleCores () { exports.defaults = () => ({ // project deployment base - baseUrl: '/', + publicPath: '/', // where to output built files outputDir: 'dist', diff --git a/packages/@vue/cli-service/lib/util/resolveClientEnv.js b/packages/@vue/cli-service/lib/util/resolveClientEnv.js index 0b15264abe..2aa83f1554 100644 --- a/packages/@vue/cli-service/lib/util/resolveClientEnv.js +++ b/packages/@vue/cli-service/lib/util/resolveClientEnv.js @@ -7,7 +7,7 @@ module.exports = function resolveClientEnv (options, raw) { env[key] = process.env[key] } }) - env.BASE_URL = options.baseUrl + env.BASE_URL = options.publicPath if (raw) { return env diff --git a/packages/@vue/cli-service/lib/util/validateWebpackConfig.js b/packages/@vue/cli-service/lib/util/validateWebpackConfig.js index 83bf23fa92..dc61dce76b 100644 --- a/packages/@vue/cli-service/lib/util/validateWebpackConfig.js +++ b/packages/@vue/cli-service/lib/util/validateWebpackConfig.js @@ -28,11 +28,11 @@ module.exports = function validateWebpackConfig ( ) } - if (target === 'app' && singleConfig.output.publicPath !== options.baseUrl) { + if (target === 'app' && singleConfig.output.publicPath !== options.publicPath) { throw new Error( `\n\nConfiguration Error: ` + `Avoid modifying webpack output.publicPath directly. ` + - `Use the "baseUrl" option instead.\n` + `Use the "publicPath" option instead.\n` ) } } diff --git a/packages/@vue/cli-service/lib/webpack/CorsPlugin.js b/packages/@vue/cli-service/lib/webpack/CorsPlugin.js index 243e889bfb..51ee44b525 100644 --- a/packages/@vue/cli-service/lib/webpack/CorsPlugin.js +++ b/packages/@vue/cli-service/lib/webpack/CorsPlugin.js @@ -1,8 +1,8 @@ module.exports = class CorsPlugin { - constructor ({ baseUrl, crossorigin, integrity }) { + constructor ({ publicPath, crossorigin, integrity }) { this.crossorigin = crossorigin this.integrity = integrity - this.baseUrl = baseUrl + this.publicPath = publicPath } apply (compiler) { @@ -11,7 +11,7 @@ module.exports = class CorsPlugin { const ssri = require('ssri') const computeHash = url => { - const filename = url.replace(this.baseUrl, '') + const filename = url.replace(this.publicPath, '') const asset = compilation.assets[filename] if (asset) { const src = asset.source() diff --git a/packages/@vue/cli-ui/index.js b/packages/@vue/cli-ui/index.js index 318c5ec955..02cb14e15f 100644 --- a/packages/@vue/cli-ui/index.js +++ b/packages/@vue/cli-ui/index.js @@ -1,6 +1,6 @@ exports.clientAddonConfig = function ({ id, port = 8042 }) { return { - baseUrl: process.env.NODE_ENV === 'production' + publicPath: process.env.NODE_ENV === 'production' ? `/_addon/${id}` : `http://localhost:${port}/`, configureWebpack: { diff --git a/packages/@vue/cli-ui/locales/en.json b/packages/@vue/cli-ui/locales/en.json index 3bbc9df402..3f23877c4a 100644 --- a/packages/@vue/cli-ui/locales/en.json +++ b/packages/@vue/cli-ui/locales/en.json @@ -583,6 +583,10 @@ "label": "Base URL", "description": "The base URL your application will be deployed at, for example '/my-app/'. Use an empty string ('') so that all assets are linked using relative paths." }, + "publicPath": { + "label": "Public Path", + "description": "The base URL your application will be deployed at, for example '/my-app/'. Use an empty string ('') so that all assets are linked using relative paths." + }, "outputDir": { "label": "Output directory", "description": "The directory where the production build files will be generated" diff --git a/packages/@vue/cli-ui/ui-defaults/config.js b/packages/@vue/cli-ui/ui-defaults/config.js index 6496138660..fc597ff86c 100644 --- a/packages/@vue/cli-ui/ui-defaults/config.js +++ b/packages/@vue/cli-ui/ui-defaults/config.js @@ -13,14 +13,14 @@ module.exports = api => { onRead: ({ data }) => ({ prompts: [ { - name: 'baseUrl', + name: 'publicPath', type: 'input', default: '/', - value: data.vue && data.vue.baseUrl, - message: 'org.vue.vue-webpack.config.vue-cli.baseUrl.label', - description: 'org.vue.vue-webpack.config.vue-cli.baseUrl.description', + value: data.vue && (data.vue.publicPath || data.vue.baseUrl), // fallback to baseUrl for compatibility + message: 'org.vue.vue-webpack.config.vue-cli.publicPath.label', + description: 'org.vue.vue-webpack.config.vue-cli.publicPath.description', group: 'org.vue.vue-webpack.config.vue-cli.groups.general', - link: 'https://cli.vuejs.org/config/#baseurl' + link: 'https://cli.vuejs.org/config/#publicPath' }, { name: 'outputDir',