Skip to content

Commit

Permalink
fix: enable whitelist in exclude function
Browse files Browse the repository at this point in the history
  • Loading branch information
yyx990803 committed Apr 27, 2018
1 parent 874c196 commit 5b0e392
Show file tree
Hide file tree
Showing 3 changed files with 35 additions and 1 deletion.
17 changes: 17 additions & 0 deletions docs/guide/pre-processors.md
Original file line number Diff line number Diff line change
Expand Up @@ -172,6 +172,23 @@ npm install -D babel-core babel-loader

Configuration of Babel can be done via `.babelrc` or `babel-loader` options.

### Excluding node_modules

It is common to have `exclude: /node_modules/` for JS transpilation rules (e.g. `babel-loader`) that apply to `.js` files. Due to the inference change of v15, if you import a Vue SFC inside `node_modules`, its `<script>` part will be excluded from transpilation as well.

In order to ensure JS transpilation is applied to Vue SFCs in `node_modules`, you need to whitelist them by using an exclude function instead:

``` js
{
test: /\.js$/,
loader: 'babel-loader',
exclude: file => (
/node_modules/.test(file) &&
!/\.vue\.js/.test(file)
)
}
```

## TypeScript

``` bash
Expand Down
17 changes: 17 additions & 0 deletions docs/migrating.md
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,23 @@ The benefit is that this same rule also applies to plain `*.less` imports from J

v15 also allows using non-serializable options for loaders, which was not possible in previous versions.

### Importing SFCs from Dependencies

It is common to have `exclude: /node_modules/` for JS transpilation rules (e.g. `babel-loader`) that apply to `.js` files. Due to the inference change of v15, if you import a Vue SFC inside `node_modules`, its `<script>` part will be excluded from transpilation as well.

In order to ensure JS transpilation is applied to Vue SFCs in `node_modules`, you need to whitelist them by using an exclude function instead:

``` js
{
test: /\.js$/,
loader: 'babel-loader',
exclude: file => (
/node_modules/.test(file) &&
!/\.vue\.js/.test(file)
)
}
```

### Template Preprocessing

v14 and below uses [consolidate](https://github.com/tj/consolidate.js/) to compile `<template lang="xxx">`. v15 now applies preprocessing for them using webpack loaders instead.
Expand Down
2 changes: 1 addition & 1 deletion lib/plugin.js
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@ function cloneRule (rule, normalizedRule) {
if (resource && parsed.lang == null) {
return false
}
const fakeResourcePath = `${currentResource.replace(/\.vue$/, '')}.${parsed.lang}`
const fakeResourcePath = `${currentResource}.${parsed.lang}`
if (resource && !resource(fakeResourcePath)) {
return false
}
Expand Down

0 comments on commit 5b0e392

Please sign in to comment.