Skip to content

Commit

Permalink
feat: make __file injection opt-in in production (#1475)
Browse files Browse the repository at this point in the history
  • Loading branch information
sodatea committed Jan 23, 2019
1 parent adc6dd6 commit 001382d
Show file tree
Hide file tree
Showing 3 changed files with 37 additions and 9 deletions.
9 changes: 9 additions & 0 deletions docs/options.md
Original file line number Diff line number Diff line change
Expand Up @@ -92,3 +92,12 @@ When both options are specified, enables file-system-based template compilation
- default: `true`

In development mode, we use [prettier](https://prettier.io/) to format the compiled render function for ease of debugging by default. However, if you encounter any obscure bug of prettier, such as [exponential compilation time for deeply nested functions](https://github.com/prettier/prettier/issues/4672), you can disable this option to circumvent it.

## exposeFilename

- type: `boolean`
- default: `false`

In non-production environments, vue-loader injects a `__file` property to components for better debugging experience. If the `name` property is missing in a component, Vue will infer it from the `__file` field to display in console warnings.

This property is stripped in production builds by default. But you may want to retain it if you are developing a component library and don't want to bother specifying `name` in each component. Then you can turn this option on.
17 changes: 9 additions & 8 deletions lib/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -176,14 +176,15 @@ var component = normalizer(
}

// Expose filename. This is used by the devtools and Vue runtime warnings.
code += `\ncomponent.options.__file = ${
isProduction
// For security reasons, only expose the file's basename in production.
? JSON.stringify(filename)
// Expose the file's full path in development, so that it can be opened
// from the devtools.
: JSON.stringify(rawShortFilePath.replace(/\\/g, '/'))
}`
if (!isProduction) {
// Expose the file's full path in development, so that it can be opened
// from the devtools.
code += `\ncomponent.options.__file = ${JSON.stringify(rawShortFilePath.replace(/\\/g, '/'))}`
} else if (options.exposeFilename) {
// Libraies can opt-in to expose their components' filenames in production builds.
// For security reasons, only expose the file's basename in production.
code += `\ncomponent.options.__file = ${JSON.stringify(filename)}`
}

code += `\nexport default component.exports`
// console.log(code)
Expand Down
20 changes: 19 additions & 1 deletion test/advanced.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,13 +54,31 @@ test('expose file path as __file outside production', done => {
})
})

test('expose file basename as __file in production', done => {
test('no __file in production when exposeFilename disabled', done => {
const origNodeEnv = process.env.NODE_ENV
process.env.NODE_ENV = 'production'
mockBundleAndRun(
{
entry: 'basic.vue'
},
({ module }) => {
expect(module.__file).toBe(undefined)
process.env.NODE_ENV = origNodeEnv
done()
}
)
})

test('expose file basename as __file in production when exposeFilename enabled', done => {
const origNodeEnv = process.env.NODE_ENV
process.env.NODE_ENV = 'production'
mockBundleAndRun(
{
entry: 'basic.vue',
vue: {
exposeFilename: true
}
},
({ module }) => {
expect(module.__file).toBe('basic.vue')
process.env.NODE_ENV = origNodeEnv
Expand Down

0 comments on commit 001382d

Please sign in to comment.