Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

引用外部组件时报错 #97

Closed
lijjLyb opened this issue Oct 11, 2018 · 4 comments
Closed

引用外部组件时报错 #97

lijjLyb opened this issue Oct 11, 2018 · 4 comments

Comments

@lijjLyb
Copy link

lijjLyb commented Oct 11, 2018

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
Copy link
Owner

qiu8310 commented Oct 11, 2018

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

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

@qiu8310
Copy link
Owner

qiu8310 commented Oct 11, 2018

image

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

@qiu8310
Copy link
Owner

qiu8310 commented Oct 11, 2018

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

@lijjLyb
Copy link
Author

lijjLyb commented Oct 11, 2018

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants