undefinedfix
Sign in

Nuxt introduces iView to report unexpected token import on demand

Doberon edited in Mon, 21 Nov 2022

I tried to import iView resource files as needed in nuxt 2, https://www.iviewui.com/docs/guide/start Here is my configuration process

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",
    }
}

The following error was reported after starting the project,

2 Replies
jet_black82
commented on Tue, 22 Nov 2022

Try it on the client side

laahaa
commented on Tue, 22 Nov 2022

Unexpected token import is a syntax error, that is, JS runtime does not recognize the import statement. Basically, it can be judged that the import in the code has not been translated, Node.js I won't support it.

So you should check the post loaded code to make sure it is based on commonjs.