vue2按需引入iviewui的部分组件报错error in ./node_modules/view-design/src/directives/v-click-outside-x.js

今天使用vue按需引入iviewui的Select、Table、Page等组件，控制栏报错error in ./node_modules/view-design/src/directives/v-click-outside-x.js。排查各种原因后解决方法如下：

第一步：babel按照iviewui官方的按需引入来配置

transform-vue-jsx和transform-runtime是vuecli自动创建的，第3个是iviewui官方引入配置

"plugins": [
    "transform-vue-jsx",
    "transform-runtime",
    ["import", {
      "libraryName": "view-design",
      "libraryDirectory": "src/components"
    }]
  ]

第二步：webpack配置文件里，module下的rules里的babel-loader引入node_modules/view-design/src/directives/v-click-outside-x.js

{
        test: /\.js$/,
        loader: 'babel-loader',
        include: [
          resolve('src'),
          resolve('test'),
          resolve('node_modules/webpack-dev-server/client'),
          resolve('node_modules/view-design/src/directives/v-click-outside-x.js') // 在这里引入
        ]
      }

重新npm run dev，无报错，问题解决。