docs: revisions

This commit is contained in:
Evan You
2018-02-08 22:04:22 -05:00
parent fd1ca02f16
commit c88e69492f
6 changed files with 22 additions and 17 deletions

View File

@@ -102,9 +102,9 @@ Probably the most common configuration need is tweaking the internal webpack con
See [here](./webpack.md) for full details.
### browserlist
### browserslist
You will notice a `browserlist` field in `package.json` specifying a range of browsers the project is targeting. This value will be used by `babel-preset-env` and `autoprefixer` to automatically determine the JavaScript polyfills and CSS vendor prefixes needed.
You will notice a `browserslist` field in `package.json` specifying a range of browsers the project is targeting. This value will be used by `babel-preset-env` and `autoprefixer` to automatically determine the JavaScript polyfills and CSS vendor prefixes needed.
See [here](https://github.com/ai/browserslist) for how to specify browser ranges.
@@ -118,15 +118,7 @@ See [Configuring Proxy](./cli-service.md#configuring-proxy) for more details.
Babel can be configured via `.babelrc` or the `babel` field in `package.json`.
All Vue CLI apps use `@vue/babel-preset-app` by default, which includes:
- [babel-preset-env](https://github.com/babel/babel/tree/master/packages/babel-preset-env)
- [dynamic import syntax](https://github.com/tc39/proposal-dynamic-import)
- [Object rest spread](https://github.com/tc39/proposal-object-rest-spread)
- [babel-preset-stage-2](https://github.com/babel/babel/tree/master/packages/babel-preset-stage-2)
- Vue JSX support
See [@vue/babel-preset-app](https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/babel-preset-app) for preset options.
All Vue CLI apps use `@vue/babel-preset-app`, which includes `babel-preset-env`, JSX support and optimized configuration for minimal bundle size overhead. See [its docs](https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/babel-preset-app) for details and preset options.
### CSS

View File

@@ -21,7 +21,7 @@ will be compiled into:
createElement('img', { attrs: { src: require('../image.png') }})
```
Internally, we use `file-loader` to determine the final file location with version hashes and correct public base paths, and use `url-loader` to conditional inline assets that are smaller than 10kb, reducing the amount of HTTP requests.
Internally, we use `file-loader` to determine the final file location with version hashes and correct public base paths, and use `url-loader` to conditionally inline assets that are smaller than 10kb, reducing the amount of HTTP requests.
#### URL Transform Rules

View File

@@ -38,6 +38,8 @@ A lib build outputs:
- `dist/myLib.css`: Extracted CSS file (can be forced into inlined by setting `css: { extract: false }` in `vue.config.js`)
**In lib mode, Vue is externalized.** This means the bundle will not bundle Vue even if your code imports Vue. If the lib is used via a bundler, it will attempt to load Vue as a dependency through the bundler; otherwise, it falls back to a global `Vue` variable.
### Web Component
> [Compatibility](https://github.com/vuejs/vue-web-component-wrapper#compatibility)
@@ -50,7 +52,7 @@ vue-cli-service build --target wc --name my-element [entry]
This will produce a single JavaScript file (and its minified version) with everything inlined. The script, when included on a page, registers the `<my-element>` custom element, which wraps the target Vue component using `@vue/web-component-wrapper`. The wrapper automatically proxies properties, attributes, events and slots. See the [docs for `@vue/web-component-wrapper`](https://github.com/vuejs/vue-web-component-wrapper) for more details.
Note the bundle relies on `Vue` being globally available on the page.
**Note the bundle relies on `Vue` being globally available on the page.**
This mode allows consumers of your component to use the Vue component as a normal DOM element:

View File

@@ -131,7 +131,7 @@ vue build MyComponent.vue
Each CLI plugin ships with a generator (which creates files) and a runtime plugin (which tweaks the core webpack config and injects commands). When you use `vue create` to create a new project, some plugins will be pre-installed for you based on your feature selection. In case you want to install a plugin into an already created project, simply install it first:
``` sh
yarn add @vue/cli-plugin-eslint
npm install -D @vue/cli-plugin-eslint
```
Then you can invoke the plugin's generator so it generates files into your project:
@@ -158,7 +158,7 @@ You can use `vue inspect` to inspect the webpack config inside a Vue CLI project
`@vue/cli` uses the same `vue` binary, so it overwrites `vue-cli@2.x`. If you still need the legacy `vue init` functionality, you can install a global bridge:
``` sh
yarn global add @vue/cli-init
npm install -g @vue/cli-init
# vue init now works exactly the same as vue-cli@2.x
vue init webpack my-project
```

View File

@@ -19,7 +19,7 @@ If you wish to be able to use CSS modules without the `.module` postfix, you can
### Pre-Processors
You can select pre-processors (Sass/Less/Stylus) when creating the project. If you did not do so, you can also just manually install the corresponding webpack loaders. The loaders are pre-configured and will automatically be picked up. For example, to add SASS to an existing project, simply run:
You can select pre-processors (Sass/Less/Stylus) when creating the project. If you did not do so, you can also just manually install the corresponding webpack loaders. The loaders are pre-configured and will automatically be picked up. For example, to add Sass to an existing project, simply run:
``` sh
npm install -D sass-loader node-sass

View File

@@ -6,7 +6,18 @@
- **`vue-cli-service lint`**
Lints and fixes files in `src` and `test`.
```
Usage: vue-cli-service lint [options] [...files]
Options:
--format [formatter] specify formatter (default: codeframe)
--no-fix do not fix errors
```
Lints and fixes files. If no specific files are given, it lints all files in `src` and `test`.
Other [ESLint CLI options](https://eslint.org/docs/user-guide/command-line-interface#options) are also supported.
## Configuration