引用外部组件时报错

[lijjLyb]

npm 安装了一个外部 ui 样式库

在页面 cjson 中增加了组件引用(文档里能写下使用 ~ 可以引用外部组件吗...明明都写了这个功能了...)

usingComponents": {
    "button": "~/vant-weapp/dist/button"
  }

编译时报错

Module parse failed: 'import' and 'export' may only appear at the top level

可以确定的是那个样式库应该是没问题的

我该怎么解决这个问题呢?

ps: 百度了下 报这个错可能是 babel 有问题 是这个原因吗

[qiu8310]

看了下，因为原代码有 import 在里面，而 minapp 不会使用 babel 编译 node_module 中的组件，所以报你那个错。

有一个解决方案是，你修改 webpack 的配置，使得 babel 处理 vant-weapp 这个组件中的 js 文件

[qiu8310]

这是默认的配置，你通过 webpack.minapp.js 文件应该可以修改，只是不是太方便

[qiu8310]

还有另外一个方法就是不要通过 npm 安装 vant-weapp，把它 github 中的源代码移入到你的 src 目录里（当然这个可能简单些，但不方便更新版本）

[lijjLyb]

3Q 决定直接把代码拷进去了 更新的话回头再说 不是专门做前端的 webpack 不太会用 看来要抽空补补课...