考虑下面的组件模板…
<template>
<Unknown></Unknown>
</template>
...其中,Unknown
可以是全球注册的组件,也可以是not.在运行时,我会遇到以下信息错误:
[Vue warn]:未知自定义元素:-您注册了
[...]
然而,对于我的用例,我想强制要求在构建时不会发生类似的情况.目前,vue-cli-service build
在这个场景中执行了一个成功的构建,然后在运行时显示错误(此时没有用).
我很好奇,是否有一种方法可以内省地捕获这个潜在的问题,并迫使构建失败.我希望能发现一个不允许出现这种情况的--strict
号标志(或类似标志).
我甚至try 了template-compiler和component-compiler,看看我是否能在手动判断中捕捉到它,令人震惊的是,没有报告任何错误.
有什么 idea 吗?
下面是我提到的使用更低级别component-compiler-utils的更详细的实验.这应该是便携式的,以观察相同的结果.注意两个错误报告字段都是空的!
"dependencies": {
"@vue/component-compiler-utils": "3.0.0",
"vue-template-compiler": "2.6.10"
}
[...]
const ccu = require('@vue/component-compiler-utils');
const vtc = require('vue-template-compiler');
const file = `
<template>
<div class="component">
<Unknown></Unknown>
</div>
</template>
<script>
export default {
name: 'Component',
data: function () {
return {}
},
}
</script>
<style scoped lang="scss">
.component {
width: 100px;
height: 100px;
}
</style>
`;
const parsed = ccu.parse({
compiler: vtc,
source: file,
needMap: false
});
const compiled = ccu.compileTemplate({
compiler: vtc,
source: parsed.template.content,
});
console.log('parsed | errors', parsed.errors); // [] empty!
console.log('compiled | tips', compiled.tips); // [] empty!
console.log('compiled | errors', compiled.errors); // [] empty!