#独家
vue2 源码调试,如何调试 .vue文件?

2023-04-30 0 3,921

想要实现的目的是:调试 .vue 文件,能在src源码中打断点

// Vue-2.6.14  package.json
"scripts": {
    "dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev --sourcemap",
    "dev:compiler": "rollup -w -c scripts/config.js --environment TARGET:web-compiler --sourcemap",

添加–sourcemap后,就可以在调试examples中案例时在src源码中打断点。
但是examples里的案例并没有使用 .vue 文件的,都是把html文件中的DOM作为模板
所以我在 examples/todomvc下加了一个 test.vue 文件

<template>
    <div>.vue文件</div>
</template>

<script>
export default {
    name: 'test'
}
</script>

app.js文件内容改为

import test from './test'
new Vue({
    el: '#wrapper',
    components: {
        test
    },
    render: h => h(test)
})

提示 caught SyntaxError: Cannot use import statement outside a module
试了网上给的几个解决方案,包括在package.json中添加 “type”: “module” ,无效
不知道是不是哪个地方没有配置好,该怎么修改?

我一般直接在浏览器里打断点,只要配置好 sourcemap,就能在 Devtools > Source 里打断点了。

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

1. 有软官网所有资源来源于开发团队,加入会员即可下载使用!如有问题请联系右下角在线客服!
2. 有软官方保障所有软件都通过人工亲测,为每位会员用户提供安全可靠的应用软件、游戏资源下载及程序开发服务。
3. 有软团队针对会员诉求,历经多年拥有现今开发成果, 每款应用程序上线前都经过人工测试无误后提供安装使用,只为会员提供安全原创的应用。
4. PC/移动端应用下载后如遇安装使用问题请联系右下角在线客服或提交工单,一对一指导解决疑难。

有软官网_用软件,找有软 技术分享 vue2 源码调试,如何调试 .vue文件? https://www.jiaruvip.com/1662.html

有软应用商店是经过官方安全认证,保障正版软件平台

相关资源

官方客服团队

为您解决烦忧 - 24小时在线 专业服务