在Docker的服务器上调试nuxtjs .vue文件

Node.js的 Vue.js

猴子

2020-03-23

我目前有一个nuxt应用程序设置为一个通用应用程序,在其中使用Docker托管。我已经完成了几乎所有的工作,调试器附加并找到了遍历中间件和api调用的局部变量,但是在调试文件中asyncData方法时,.vue我看不到任何局部变量,并且断点不断移至该.catch行:

在此处输入图片说明

在当前上下文中,我还得到了一堆其他随机的东西,在这种情况下为“模块”?

我也将此行添加到了我的nuxt.config.js文件中,以确保它使用了正确的源映射:

     /*
  ** Build configuration
  */
  build: {
    /*
    ** You can extend webpack config here
    */
    extend(config, ctx) {
      console.log(`IsClient: ${ctx.isClient}`);
      console.log(`isDev: ${ctx.isDev}`);
      if (ctx.isDev) { 
        config.devtool = ctx.isClient ? 'source-map' : 'inline-source-map'
      }
    }
  }

这也是我的.vscode配置:

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Docker: Attach to Node",
            "type": "node",
            "request": "attach",
            "remoteRoot": "/usr/share/nginx/app",
            "port": 9229,
            "address": "localhost",
            "localRoot": "${workspaceFolder}/app",
            "protocol": "inspector",
            "restart": true,
            "sourceMaps": true
        }
    ]
}

另外,这是我用来启动容器的命令:

 node --inspect=0.0.0.0:9229 \
            ./node_modules/.bin/nuxt \
            & nginx -g "daemon off;" \

自从编译以来,我尝试了许多不同的方法,包括使用babel-register并从babel-node启动它,但是这些方法都无效。

我在这里想念什么吗?.vue创建通用应用程序时,我们可以不调试服务器上的文件吗?

更新

我改用Webstorm,无论出于何种原因,调试都可以正常进行。我想那是使用IDE和文本编辑器之间的区别。

第2791篇《在Docker的服务器上调试nuxtjs .vue文件》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android