qiu8310/minapp

引用外部组件时报错

Closed this issue · 4 comments

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

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

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

编译时报错

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

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

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

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

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

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

image

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

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

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