生产环境下，生成的sourcemap文件不对应源码，而是未压缩的产物

[peacejj]

相关平台

微信小程序

小程序基础库: 和小程序版本无关
使用框架: React

复现步骤

操作步骤：任意一个hello word项目编译后，查看首页的源码及.map文件。

示例

taro源码（最简单的示例）：

import React from 'react'
import { View, Text } from '@tarojs/components'
import { useLoad } from '@tarojs/taro'
import './index.scss'
import { p } from './a';
export default class Index extends React.Component {
    componentDidMount() {
        this.jump(p);
    }
 
    jump(b) {
        const a = 1;
        let c = a   b;
        throw new Error('sec-error' c)
    }
 
    render() { return 'test'; }
}

生成的sourcemap

{
    "version": 3,
    "file": "pages/sec/index.js",
    "mappings": "kJAAMA,EAAI,MCONC,EAAqB,SAAUC,GACjC,SAASD,IAEP,OADA,OAAgBE,KAAMF,IACf,OAAWE,KAAMF,EAAOG,UACjC,CAEA,OADA,OAAUH,EAAOC,IACV,OAAaD,EAAO,CAAC,CAC1BI,IAAK,oBACLC,MAAO,WACLH,KAAKI,KAAKP,EACZ,GACC,CACDK,IAAK,OACLC,MAAO,SAAcE,GACnB,IAAIC,EAAI,EACJC,EAAID,EAAID,EACZ,MAAM,IAAIG,MAAM,YAAcD,EAChC,GACC,CACDL,IAAK,SACLC,MAAO,WACL,MAAO,MACT,IAEJ,CAxByB,CAwBvB,aC7BEM,EAAS,CAAC,uBAAyB,gBAG5BC,MAAK,IAAAC,kBAAiB,EAAW,kBAAmB,CAACC,KAAK,CAACC,GAAG,KAAMJ,GAAU,CAAC,G",
    "sources": [
        "webpack://ts-ggg/._src_pages_sec_a.js",
        "webpack://ts-ggg/./src/pages/sec/index.tsx?a97f",
        "webpack://ts-ggg/._src_pages_sec_index.tsx"
    ],
    "sourcesContent": [
        "const p = '123';\nexport {\n    p\n};",
        "import _classCallCheck from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/classCallCheck.js\";\nimport _createClass from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/createClass.js\";\nimport _callSuper from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/callSuper.js\";\nimport _inherits from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/inherits.js\";\nimport React from 'react';\nimport './index.scss';\nimport { p } from './a';\nvar Index = /*#__PURE__*/function (_React$Component) {\n  function Index() {\n    _classCallCheck(this, Index);\n    return _callSuper(this, Index, arguments);\n  }\n  _inherits(Index, _React$Component);\n  return _createClass(Index, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      this.jump(p);\n    }\n  }, {\n    key: \"jump\",\n    value: function jump(b) {\n      var a = 1;\n      var c = a + b;\n      throw new Error('sec-error' + c);\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return 'test';\n    }\n  }]);\n}(React.Component);\nexport { Index as default };",
        "import { createPageConfig } from '@tarojs/runtime'\nimport component from \"!!../../../node_modules/@tarojs/taro-loader/lib/entry-cache.js?name=pages/sec/index!./index.tsx\"\nvar config = {\"navigationBarTitleText\":\"首页\"};\n\n\nvar inst = Page(createPageConfig(component, 'pages/sec/index', {root:{cn:[]}}, config || {}))\n\n\nexport default component\n"
    ],
    "names": [
        "p",
        "Index",
        "_React$Component",
        "this",
        "arguments",
        "key",
        "value",
        "jump",
        "b",
        "a",
        "c",
        "Error",
        "config",
        "Page",
        "createPageConfig",
        "root",
        "cn"
    ],
    "sourceRoot": ""
}

其中sourcesContent对应的源码部分，可以看出明显不是taro源码：

import _classCallCheck from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/classCallCheck.js\";
import _createClass from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/createClass.js\";
import _callSuper from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/callSuper.js\";
import _inherits from \"/Users/qitmac001076/other/code/taro-demo/ts-ggg/node_modules/@babel/runtime/helpers/esm/inherits.js\";
import React from 'react';
import './index.scss';
import { p } from './a';
var Index = /*#__PURE__*/function (_React$Component) {
  function Index() {
    _classCallCheck(this, Index);
    return _callSuper(this, Index, arguments);
  }
  _inherits(Index, _React$Component);
  return _createClass(Index, [{
    key: \"componentDidMount\",
    value: function componentDidMount() {
      this.jump(p);
    }
  }, {
    key: \"jump\",
    value: function jump(b) {
      var a = 1;
      var c = a   b;
      throw new Error('sec-error'   c);
    }
  }, {
    key: \"render\",
    value: function render() {
      return 'test';
    }
  }]);
}(React.Component);
export { Index as default };

期望结果

期望sourcemap对应的是taro源码

实际结果

现在结果是对应编译后的产物

环境信息

👽 Taro v3.6.23


  Taro CLI 3.6.23 environment info:
    System:
      OS: macOS 12.4
      Shell: 5.8.1 - /bin/zsh
    Binaries:
      Node: 16.20.2 - ~/.nvm/versions/node/v16.20.2/bin/node
      Yarn: 1.22.22 - ~/.nvm/versions/node/v16.20.2/bin/yarn
      npm: 8.19.4 - ~/.nvm/versions/node/v16.20.2/bin/npm
    npmPackages:
      @tarojs/cli: 3.6.24 => 3.6.24 
      @tarojs/components: 3.6.24 => 3.6.24 
      @tarojs/helper: 3.6.24 => 3.6.24 
      @tarojs/plugin-framework-react: 3.6.24 => 3.6.24 
      @tarojs/plugin-platform-alipay: 3.6.24 => 3.6.24 
      @tarojs/plugin-platform-h5: 3.6.24 => 3.6.24 
      @tarojs/plugin-platform-weapp: 3.6.24 => 3.6.24 
      @tarojs/react: 3.6.24 => 3.6.24 
      @tarojs/runtime: 3.6.24 => 3.6.24 
      @tarojs/shared: 3.6.24 => 3.6.24 
      @tarojs/taro: 3.6.24 => 3.6.24 
      @tarojs/taro-loader: 3.6.24 => 3.6.24 
      @tarojs/webpack5-runner: 3.6.24 => 3.6.24 
      babel-preset-taro: 3.6.24 => 3.6.24 
      eslint-config-taro: 3.6.24 => 3.6.24 
      react: ^18.0.0 => 18.3.1 
      react-native: 0.69.3 => 0.69.3 

[peacejj]

进一步排查后，发现只有页面会这样，页面引用的组件还是对应源码