Nuxt 按需引入 iview 报错 Unexpected token import

我在 Nuxt 2 中尝试按需引入 iview 资源文件,https://www.iviewui.com/docs/guide/start,下面是我的配置过程

nuxt.config.js

  plugins: [
    '@/plugins/iview'
  ],
  build: {
    babel: {
      "plugins": [["import", {
        "libraryName": "iview",
        "libraryDirectory": "src/components",
      }]]
    },
  }

plugins/iview.js

import Vue from 'vue'
import 'iview/dist/styles/iview.css'
import { Button } from 'iview';


console.log('iView:', Button)


Vue.use(Button)


// Vue.use(iView, {
//   locale
// })

package.json

{
    "dependencies": {
        "iview": "^3.1.5",
    },
    "devDependencies": {
        "babel-plugin-import": "^1.13.0",
    }
}

启动项目后报了如下的错误,
image

阅读 5k
2 个回答

在客户端引入试试
image.png

unexpected token import 是语法错误,也就是 JS runtime 不认 import 这个语句,基本可以判断是代码中的 import 没有转译,Node.js 不支持。

所以应该检查后加载的代码,保证是基于 CommonJS 的。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题