h5下： Module parse failed: Unexpected token (10:11) You may need an appropriate loader to handle this file type.

[nevernet]

这个问题在issue基本上都翻过了。 但是不知道怎么解决。

错误：

./node_modules/@jd/jd-ui/dist/h5/components/jd-card/index.js 10:11
Module parse failed: Unexpected token (10:11)
You may need an appropriate loader to handle this file type.
|   }
|   render() {
>     return <View className="jd-card">{this.props.children}</View>;
|   }
| }

jd-card文件的源代码：

import { Component } from "@tarojs/taro-h5";
import Nerv from "nervjs";
import { View } from '@tarojs/components';
import './index.scss';
export default class JDCard extends Component {
  constructor(props) {
    super(props);
  }
  render() {
    return <View className="jd-card">{this.props.children}</View>;
  }
}
JDCard.defaultProps = {};

尝试的方式：

• 删除.temp
• 删除dist
• 删除node_modules

config/index.js的h5配置里面添加:

h5: {
    esnextModules: ['taro-ui', '@jd', '@jd/jd-ui'],
}

安装路径:

默认使用npm 安装。 registry是npmjs.org的。

taro info

Taro CLI 1.2.22 environment info:
    System:
      OS: macOS 10.14.3
      Shell: 5.6.2 - /usr/local/bin/zsh
    Binaries:
      Node: 10.15.0 - /usr/local/opt/node@10/bin/node
      npm: 6.4.1 - /usr/local/opt/node@10/bin/npm
    npmPackages:
      @tarojs/components: 1.2.22 => 1.2.22 
      @tarojs/plugin-babel: 1.2.22 => 1.2.22 
      @tarojs/plugin-csso: 1.2.22 => 1.2.22 
      @tarojs/plugin-sass: 1.2.22 => 1.2.22 
      @tarojs/plugin-uglifyjs: 1.2.22 => 1.2.22 
      @tarojs/router: 1.2.22 => 1.2.22 
      @tarojs/taro: 1.2.22 => 1.2.22 
      @tarojs/taro-alipay: 1.2.22 => 1.2.22 
      @tarojs/taro-h5: 1.2.22 => 1.2.22 
      @tarojs/taro-swan: 1.2.22 => 1.2.22 
      @tarojs/taro-tt: 1.2.22 => 1.2.22 
      @tarojs/taro-weapp: 1.2.22 => 1.2.22 
      @tarojs/webpack-runner: 1.2.22 => 1.2.22 
      eslint-config-taro: 1.2.22 => 1.2.22 
      eslint-plugin-taro: 1.2.22 => 1.2.22 
      nervjs: ^1.3.9 => 1.3.13 
    npmGlobalPackages:
      typescript: 3.3.3333

help please

[taro-bot]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

[nevernet]

复现的代码在这里： https://github.com/nevernet/taro-h5-test

复现的办法：
git clone 这个项目。 项目的名字默认为:taro-h5-test。
然后随便复制到另外名字： mv taro-h5-test ddd
然后

npm install 
npm run build:h5

请注意，默认情况下，esnextModules:不用添加['taro-ui']。
如果添加了这个，项目里面自定义的@jd/jd-ui依然会报错。

[nevernet]

很神奇的是，默认的taro-h5-test确实可以编译成功的。

[nevernet]

@luckyadam @Littly help

[taro-bot]

CC @Littly

[Littly]

斜杠干扰了正则的解析，后续解决这个问题。暂时添加一个/@jd\/jd-ui/可以解决：

{
  ...,
  esnextModules: ['taro-ui', /@jd\/jd-ui/]
}

[taro-bot]

Hello~

您的问题楼上已经有了确切的回答，如果没有更多的问题这个 issue 将在 15 天后被自动关闭。

如果您在这 15 天中更新更多信息自动关闭的流程会自动取消，如有其他问题也可以发起新的 Issue。

Good luck and happy coding~

[tourze]

@Littly 这个问题解决了吗。。我实际测试依然存在。

[hirozhuz]

@tourze 请问你是否解决了这个报错的问题，我也遇到了。

[sanqi-med]

我也遇到了类似的问题

[nevernet]

1.3.x最新版本应该没这些问题了

[lemondreamtobe]

我引入了node_module中的一个模块下的一个ts文件也会报这个异常
Module parse failed: Unexpected token (20:30)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| * @returns
| */

export function createApi(mock: ServerFunc, http: ServerFunc) {

有人遇到相同问题吗