From c4a92129271ddc3583584e7bb37a0917cf466d9c Mon Sep 17 00:00:00 2001 From: Doug Allrich <1835454+185driver@users.noreply.github.com> Date: Sat, 27 Jul 2019 19:37:53 -0500 Subject: [PATCH] docs: force consistent spelling of vue cli 3 (#8112) Vue CLI 3 is spelling several ways across the docs, in part because Vue changed the package name of the CLI between v2 and v3. This commit simply makes the spelling consistent throughout. Eventually, it may be better to drop the version number entirely and just use 'Vue CLI' as the Vue team does. --- README.md | 6 +++--- .../docs/src/lang/en/customization/ALaCarte.json | 10 +++++----- packages/docs/src/lang/en/customization/Icons.json | 2 +- .../src/lang/en/customization/SassVariables.json | 4 ++-- .../getting-started/FrequentlyAskedQuestions.json | 2 +- .../src/lang/en/getting-started/QuickStart.json | 14 +++++++------- .../src/lang/en/getting-started/UnitTesting.json | 2 +- .../src/lang/en/getting-started/WhyVuetify.json | 2 +- packages/docs/src/lang/en/meta.json | 2 +- packages/docs/src/lang/en/themes/Premium.json | 6 +++--- packages/docs/src/lang/en/vuetify/Home.json | 2 +- .../docs/src/lang/eo-UY/customization/Icons.json | 2 +- packages/docs/src/lang/eo-UY/framework/Icons.json | 4 ++-- .../src/lang/es-MX/getting-started/QuickStart.json | 8 ++++---- packages/docs/src/lang/es-MX/vuetify/Home.json | 2 +- .../docs/src/lang/es-MX/vuetify/PreMadeThemes.json | 4 ++-- .../src/lang/fr-FR/customization/ALaCarte.json | 2 +- .../docs/src/lang/fr-FR/framework/ALaCarte.json | 4 ++-- packages/docs/src/lang/fr-FR/themes/Premium.json | 4 ++-- packages/docs/src/lang/fr-FR/vuetify/Home.json | 2 +- packages/docs/src/lang/ja-JP/vuetify/Home.json | 2 +- .../src/lang/ko-KR/framework/PreMadeThemes.json | 4 ++-- packages/docs/src/lang/ko-KR/vuetify/Home.json | 2 +- packages/docs/src/lang/pt-BR/vuetify/Home.json | 2 +- .../docs/src/lang/ru-RU/customization/Icons.json | 2 +- packages/docs/src/lang/ru-RU/framework/Icons.json | 4 ++-- .../src/lang/ru-RU/framework/PreMadeThemes.json | 2 +- .../src/lang/ru-RU/getting-started/QuickStart.json | 10 +++++----- packages/docs/src/lang/ru-RU/themes/Premium.json | 4 ++-- packages/docs/src/lang/ru-RU/vuetify/Home.json | 2 +- .../src/lang/vi-VN/getting-started/QuickStart.json | 6 +++--- packages/docs/src/lang/vi-VN/vuetify/Home.json | 2 +- .../src/lang/zh-CN/framework/PreMadeThemes.json | 2 +- .../src/lang/zh-CN/getting-started/QuickStart.json | 14 +++++++------- packages/docs/src/lang/zh-CN/themes/Premium.json | 4 ++-- 35 files changed, 73 insertions(+), 73 deletions(-) diff --git a/README.md b/README.md index 885a98d0c95..a5278c4359a 100644 --- a/README.md +++ b/README.md @@ -161,7 +161,7 @@ Harness the power of the [Vuetify community](https://community.vuetifyjs.com) an Vuetify supports all **modern browsers**, including IE11 and Safari 9+ (using polyfills). From mobile📱 to laptop 💻 to desktop 🖥, you can rest assured that your application will work as expected. -Interested in the bleeding edge? Try the vue-cli Webpack SSR (Server side rendered) template and build websites optimized for SEO. +Interested in the bleeding edge? Try the Vue CLI 3 Webpack SSR (Server side rendered) template and build websites optimized for SEO. For more information about IE11 and Safari 9+ polyfills, visit our [Quick Start Guide](https://vuetifyjs.com/en/getting-started/quick-start#ie11-safari-9-support) @@ -177,7 +177,7 @@ To get started with Vuetify, you can follow one of these simple set-up instructi Looking to dive right in with zero setup and downtime? Check out our [CodePen.io One Minute Quickstart](https://template.vuetifyjs.com/) -#### Vue CLI-3 Installation +#### Vue CLI 3 Installation Setting up Vuetify with Vue's CLI is really easy 👌. @@ -233,7 +233,7 @@ On the next screen, search for `Vuetify` on the list, select it, and install it - A vue-cli-3 plugin for installing and configuring Vuetify + A Vue CLI 3 plugin for installing and configuring Vuetify diff --git a/packages/docs/src/lang/en/customization/ALaCarte.json b/packages/docs/src/lang/en/customization/ALaCarte.json index ddd781887db..64fe9f15e33 100644 --- a/packages/docs/src/lang/en/customization/ALaCarte.json +++ b/packages/docs/src/lang/en/customization/ALaCarte.json @@ -1,22 +1,22 @@ { "header": "# A-la-carte (treeshaking)", - "headerText": "Being a component framework, Vuetify will always grow horizontally. Depending on your project, a small **package size** may be a requirement. The A la carte system enables you to pick and choose which components to import, drastically _lowering_ your build size. New projects created with the [vue-cli plugin](/getting-started/quick-start#new-applications) have this enabled by default.", - "treeshakeWarning": "Treeshaking will only work with Webpack 4 in **production mode**. This is automatic when using vue-cli-3.", + "headerText": "Being a component framework, Vuetify will always grow horizontally. Depending on your project, a small **package size** may be a requirement. The A la carte system enables you to pick and choose which components to import, drastically _lowering_ your build size. New projects created with the [Vue CLI 3 plugin](/getting-started/quick-start#new-applications) have this enabled by default.", + "treeshakeWarning": "Treeshaking will only work with Webpack 4 in **production mode**. This is automatic when using Vue CLI 3.", "loaderHeader1": "## vuetify-loader", "loaderText1a": "Keeping track of all the components you're using can be a real chore. The [vuetify-loader](https://github.com/vuetifyjs/vuetify-loader) alleviates this pain by automatically importing all the Vuetify components you use, where you use them. This will also make code-splitting more effective, as webpack will only load the components required for that chunk to be displayed.", "loaderHeader2": "### Importing", "loaderText2a": "In order to take advantage of a-la-carte components, you must import Vuetify from **vuetify/lib**.", "optionsInfo": "The options object that you pass as the second argument to **Vue.use** can also include a components, directives and a transitions property.", "loaderHeader3": "### vue.config.js installation", - "loaderText3a": "While it is not recommended, you can opt out of using the cli plugin and instead manually configure the loader via the [configure webpack](https://cli.vuejs.org/config/#configurewebpack) option from vue-cli-3.", + "loaderText3a": "While it is not recommended, you can opt out of using the Vue CLI 3 plugin and instead manually configure the loader via the [configure webpack](https://cli.vuejs.org/config/#configurewebpack) option from Vue CLI 3.", "loaderHeader4": "### Webpack installation", "loaderText4a": "You can also explicitly install the loader for webpack based projects. Similar to the vue.config.js setup, you simply add the loader to your project's webpack plugins.", "loaderHeader5": "## Required styles", - "loaderText5a": "When you import from `vuetify/lib` the baseline framework styles are pulled in as well. Each component is individually responsible for their styles and will be compiled just the same. If you are using `vue-cli-3` and the `vue-cli-plugin-vuetify` plugin, this is done for you automatically and you can **skip** this section. If you are working in a project where you do not have access to the cli, you can manually included the required packages.", + "loaderText5a": "When you import from `vuetify/lib` the baseline framework styles are pulled in as well. Each component is individually responsible for their styles and will be compiled just the same. If you are using Vue CLI 3 and the `vue-cli-plugin-vuetify` plugin, this is done for you automatically and you can **skip** this section. If you are working in a project where you do not have access to the cli, you can manually included the required packages.", "sassInfo": "For a more detailed explanation on how to setup your application to handle SASS, please navigate to the [theme page](/customization/theme).", "loaderText5b": "After installation you will still need to configure your webpack.config.js to parse .sass files. For more information on how to do this with **fibers**, checkout the [official documentation](https://webpack.js.org/loaders/sass-loader/).", "loaderHeader6": "## Custom dynamic imports", - "loaderText6a": "The vuetify-loader also allows you to write your own custom match functions to import your own project's components as well. This can be done in both vue-cli and webpack projects.", + "loaderText6a": "The vuetify-loader also allows you to write your own custom match functions to import your own project's components as well. This can be done in both Vue CLI 3 and webpack projects.", "loaderHeader7": "## Limitations", "loaderText7a": "When using the `vuetify-loader`, there are a few scenarios which will require manual importing of components.", "loaderHeader8": "### Dynamic components", diff --git a/packages/docs/src/lang/en/customization/Icons.json b/packages/docs/src/lang/en/customization/Icons.json index a8a581727f4..ed8d7e4a40b 100644 --- a/packages/docs/src/lang/en/customization/Icons.json +++ b/packages/docs/src/lang/en/customization/Icons.json @@ -19,7 +19,7 @@ "installFA": "### Install Font Awesome 5 Icons", "installFAText1": "The easiest way to get started with **FontAwesome** is to use a cdn. Within the head of your main `index.html` place this snippet:", "installFAText2": "To install locally you can pull in the [Free](https://fontawesome.com/) version of **FontAwesome** using your preferred package manager:", - "installFAText3": "Within your main entry point, simply import the package's **all.css**. If you are using a configured webpack project, you will need to setup support for `.css` files using the webpack [css loader](https://github.com/webpack-contrib/css-loader). If you are already using [vue-cli-3](https://cli.vuejs.org/), this is done for you automatically.", + "installFAText3": "Within your main entry point, simply import the package's **all.css**. If you are using a configured webpack project, you will need to setup support for `.css` files using the webpack [css loader](https://github.com/webpack-contrib/css-loader). If you are already using [Vue CLI 3](https://cli.vuejs.org/), this is done for you automatically.", "installFA4": "### Install Font Awesome 4 Icons", "installFA4Text1": "Same as above. Installing FontAwesome through cdn is the easiest way to check it out within your project:", "installFA4Text2": "Installing FontAwesome**4** is the same as its newer version, just from a different repository. You will be targeting the `font-awesome` repo as opposed to `@fortawesome` one.", diff --git a/packages/docs/src/lang/en/customization/SassVariables.json b/packages/docs/src/lang/en/customization/SassVariables.json index 379eac80688..6d555047505 100755 --- a/packages/docs/src/lang/en/customization/SassVariables.json +++ b/packages/docs/src/lang/en/customization/SassVariables.json @@ -6,11 +6,11 @@ "sassText2": "In the command line, run:", "sassText3": "This will setup the dependencies needed to import and parse SASS/SCSS files. Once installed, create a folder called `sass` in your src directory (or appropriate assets directory) with a file named `main.scss`. Keep in mind many of the Vuetify variables are using [SASS Lists](https://sass-lang.com/documentation/file.SASS_REFERENCE.html#lists) and must be updated with [map-merge](https://sass-lang.com/documentation/Sass/Script/Functions.html#map_merge-instance_method) as demonstrated below:", "sassText3a": "Now setup your **vue.config.js** file to load the file through the data option of the sass loader:", - "sassText4": "The next time you run **yarn run serve**, vue-cli will inject the variables file and your changes will be represented in your application.", + "sassText4": "The next time you run **yarn run serve**, Vue CLI 3 will inject the variables file and your changes will be represented in your application.", "sassAlert2": "If you are requiring the Vuetify stylesheet by a `` tag in your index file, remove it.", "sassText5": "Under the hood, the new variables will be hoisted to the top of the compiled styles and used to override the default behavior.", "sfcHeader": "## Single-file components", "sfcText1": "Using the above configuration you will also be able to access Vuetify variables in SFC files when using style blocks with `lang=\"sass\"`. However if you wish to use `lang=\"scss\"`, an extra step is necessary.", - "sfcText2": "When vue-cli compiles styles, by default it does not differentiate between file types for SASS, (**.scss** and **.sass**). Due to this, and the above configuration, when adding custom styles in a SFC with `lang=\"scss\"`, it will throw an error saying that a _semi-colon_ must be added to the import statement. However if you add this _semi-colon_ to the existing configuration, it will tell you to remove it. This is due to the fact that Vuetify uses both **.scss** and **.sass** files internally.", + "sfcText2": "When Vue CLI 3 compiles styles, by default it does not differentiate between file types for SASS, (**.scss** and **.sass**). Due to this, and the above configuration, when adding custom styles in a SFC with `lang=\"scss\"`, it will throw an error saying that a _semi-colon_ must be added to the import statement. However if you add this _semi-colon_ to the existing configuration, it will tell you to remove it. This is due to the fact that Vuetify uses both **.scss** and **.sass** files internally.", "sfcText3": "In order to solve this, we have to tell webpack to explicitly use an import statement that includes the semi-colon when encountering **scss** code." } diff --git a/packages/docs/src/lang/en/getting-started/FrequentlyAskedQuestions.json b/packages/docs/src/lang/en/getting-started/FrequentlyAskedQuestions.json index 0daf4939cbf..05be0ad67df 100644 --- a/packages/docs/src/lang/en/getting-started/FrequentlyAskedQuestions.json +++ b/packages/docs/src/lang/en/getting-started/FrequentlyAskedQuestions.json @@ -66,7 +66,7 @@ }, { "q": "### Relative images are not working in `v-card` , `v-img` and other custom vuetify components", - "a": "Vue loader converts relative paths into require functions automatically for you. Unfortunately, this is not the case when it comes to custom components. You can circumvent this issue by using `require`. If you're using Vuetify as a Vue-CLI 3 plugin, you can edit your project's [vue.config.js](https://cli.vuejs.org/config/#vue-config-js) file by modifying the options for [vue-loader](https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader).", + "a": "Vue loader converts relative paths into require functions automatically for you. Unfortunately, this is not the case when it comes to custom components. You can circumvent this issue by using `require`. If you're using Vuetify as a Vue CLI 3 plugin, you can edit your project's [vue.config.js](https://cli.vuejs.org/config/#vue-config-js) file by modifying the options for [vue-loader](https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader).", "s": "html_img_require" }, { diff --git a/packages/docs/src/lang/en/getting-started/QuickStart.json b/packages/docs/src/lang/en/getting-started/QuickStart.json index 1ecd591abe3..f5a51a3e81f 100644 --- a/packages/docs/src/lang/en/getting-started/QuickStart.json +++ b/packages/docs/src/lang/en/getting-started/QuickStart.json @@ -1,8 +1,8 @@ { "header": "# Quick start", "headerText": "Use one of the Vuetify Vue CLI packages _(based on the official examples)_ to get your project started in no time. Vuetify supports **SSR** (server-side rendering), **SPA** (single page application), **PWA** (progressive web application) and standard **HTML** pages.", - "vueCliHeader": "## Vue CLI-3 Install", - "vueCliText1": "Vue-CLI 3 is the next generation cli tool made to help you get started more easily than before. When you start your app with vue-cli you will also be able to get the official webpack updates and config changes, as well as Vuetify's updates without an arduous upgrade process.", + "vueCliHeader": "## Vue CLI 3 Install", + "vueCliText1": "Vue CLI 3 is the next generation cli tool made to help you get started more easily than before. When you start your app with Vue CLI 3 you will also be able to get the official webpack updates and config changes, as well as Vuetify's updates without an arduous upgrade process.", "vueCliText2": "For information on how to use Vue CLI 3, visit the [official documentation](https://cli.vuejs.org/guide/)", "vueCliText3": "**Tip**: If you already have **Vue CLI** installed, you can check if you are on the latest version by typing vue --version from your terminal.", "vueCliText4": "Once the cli is installed, you can generate a new project scaffold. Select the _default install_ unless you have specific packages that you need to include (e.g. _vuex_ or _vue-router_). This will create a new Vue project that's ready to go with your selected options.", @@ -21,13 +21,13 @@ "cdnText": "To test using Vuetify.js without installing a template from Vue CLI, copy the code below into your `index.html`. This will pull the latest version of Vue and Vuetify, allowing you to start playing with components. You can also use the [Vuetify starter](https://template.vuetifyjs.com) on codepen. While not recommended, if you need to utilize the cdn packages in a _production_ environment, it is recommended that you scope the versions of your assets. For more information on how to do this, navigate to the [jsdelivr](https://www.jsdelivr.com/) website.", "newHeader": "## New applications", "existingHeader": "## Existing applications", - "existingAlert": "If your existing application is using `vue-cli@3`, please use the [above guide](#new-applications) on how to install the Vuetify package.", + "existingAlert": "If your existing application is using Vue CLI 3, please use the [above guide](#new-applications) on how to install the Vuetify package.", "existingText1": "To include Vuetify into an existing project, you must install its _npm package_. You can use either `npm` or `yarn` to accomplish this task. These are both package managers that allow you to control what resources are available in your application.", "existingText2": "For a detailed explanation of how to get `npm` running in your environment, check out the [official npm documentation](https://docs.npmjs.com/getting-started/what-is-npm). Alternatively, if you wish to use yarn, you can find more information on the [official yarn documentation](https://yarnpkg.com/lang/en/docs/). Once setup, you can run either command from the cli.", "existingText3": "Once Vuetify has been installed, create a folder within you `src` directory called `plugins`. Inside, add a **vuetify.js** file. This is where we will handle all of our bootstrapping and setup of Vuetify for your project.", "existingHeader3a": "### vuetify-loader installation", "existingText3a": "There are three ways in which you can install Vuetify. The first (and recommended) way is to utilize the [vuetify-loader](https://github.com/vuetifyjs/vuetify-loader) or what we call automatic **A-la-carte**. This will ensure that your application only uses the features and styles from Vuetify that are needed, significantly reducing your application's compiled size. Keep in mind, when importing from `vuetify/lib`, the necessary styles are _automatically_ imported for you.", - "existingText3a1": "If there is a reason you are unable to utilize the **vue-cli-plugin** package, you can manually install the **vuetify-loader** through your **vue.config.js** or **webpack** config. For more information on manual installation, navigate to the [A-la-carte page](/customization/a-la-carte).", + "existingText3a1": "If there is a reason you are unable to utilize the **Vue CLI 3** package, you can manually install the **vuetify-loader** through your **vue.config.js** or **webpack** config. For more information on manual installation, navigate to the [A-la-carte page](/customization/a-la-carte).", "existingHeader3b": "### A-la-carte installation", "existingText3b": "You can also manually import individual components without the need for the **vuetify-loader**. This is considered manual **A-la-carte**.", "existingHeader3c": "### Full installation", @@ -46,12 +46,12 @@ "existingText9": "For more information on different support iconfonts and advanced implementations, navigate to the [Icons](/customization/icons) page.", "alert2": "*Warning*: While Vuetify attempts to not cause any css collision as much as possible, there is no guarantee that your custom styles will not alter your experience when integrating this framework into your existing project.", "ie11Header": "## IE11 & Safari 9 support", - "ie11Text": "Vuetify utilizes features of ES2015/2017 that require the need to use polyfills for **Internet Explorer 11** and **Safari 9/10**. If you are using vue-cli-3, this is done automatically for you. Otherwise, in your project directory, you can install `babel-polyfill`:", - "ie11Text1": "Vuetify utilizes features of ES2015/2017 that require the need to use polyfills for **Internet Explorer 11** and **Safari 9/10**. If you are using vue-cli-3, this is done automatically for you. Otherwise, in your project directory, you can install `babel-polyfill`:", + "ie11Text": "Vuetify utilizes features of ES2015/2017 that require the need to use polyfills for **Internet Explorer 11** and **Safari 9/10**. If you are using Vue CLI 3, this is done automatically for you. Otherwise, in your project directory, you can install `babel-polyfill`:", + "ie11Text1": "Vuetify utilizes features of ES2015/2017 that require the need to use polyfills for **Internet Explorer 11** and **Safari 9/10**. If you are using Vue CLI 3, this is done automatically for you. Otherwise, in your project directory, you can install `babel-polyfill`:", "ie11Text2": "It is important to include the plugin as early as possible within your main **index.js** file. If using a Vuetify SSR package, this will apply to the **client-entry.js** file", "ie11Text3": "It is recommended that you use `babel-preset-env` with the corresponding polyfill to ensure only the necessary polyfills are added to your application. For more information on `babel-present-env`, [visit the documentation](https://babeljs.io/docs/en/next/babel-preset-env.html)", "ie11Text4": "Once installed, add the preset to your `.babelrc` or `babel.config.js`", - "ie11Text5": "Unfortunately vue-cli-3 doesn't automatically bring IE11 compatibility in which you may encounter various errors (such as Symbol is not defined). To assist in resolving these errors you may need to manually add `transpileDependencies` parameter in `vue.config.js`", + "ie11Text5": "Unfortunately Vue CLI 3 doesn't automatically bring IE11 compatibility in which you may encounter various errors (such as Symbol is not defined). To assist in resolving these errors you may need to manually add `transpileDependencies` parameter in `vue.config.js`", "ie11Text6": "Due to Internet Explorer's limited support for `