分享

Vue-cli 3.0 之后拆分单 vue 文件为 .ts 和 .vue 文件

 quasiceo 2018-09-06

Vue-cli 3.0 之后拆分单 vue 文件为 .ts 和 .vue 文件

2018年07月05日 14:25:42 阅读数:325更多
个人分类: Vue TypeScript

vue-cli 3.0 之后,VUE 的配置有很大的改变,

最简单的,把 HelloWorld.vue 文件中的 ts 代码拆分出去为  HelloWorld.ts 

将 HelloWorkd.vue 中改为 <script lang="ts" src="./HelloWorld.ts"></script> 

之后,运行将出错。

https://github.com/Realytics/fork-ts-checker-webpack-plugin/issues/111  

根据这儿的说法, 需要修改 vue 的配置,

在 vue-cli 3.0之后, vue的配置单独卸载 vue.config.js 中,

module.exports = {
// ...
chainWebpack: config => {
// https://github.com/vuejs/vue-cli/issues/1104
// typescript building error when import .vue file with separate .ts file, 即在 ts 文件中无法引入 .vue 组件;
// 下面的代码解决上面这个 bug, 解决方法来源: https://github.com/Realytics/fork-ts-checker-webpack-plugin/issues/111
config.plugins.delete('fork-ts-checker');
config.module
.rule('ts')
.use('ts-loader')
.tap(options => {
return { ...options,
'transpileOnly': false
}
});
}
}


运行ok..





想对作者说点什么? 我来说一句
眼袋大别傻傻割!教你2个去眼袋的简单方法 圣莎拉化妆品 · 顶新
后悔知道晚了!血糖高可以这样改善,少花冤枉钱! 白领 · 顶新

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多