使用vue cli 构建的项目，现在需要使用微信js sdk，如何使用？

Question

在vue组件中
const wx = require('../assets/js/wx')
后直接报出错误，

error in ./src/assets/js/wx.js

  error        space-unary-ops        Unexpected space after unary operator '!'                                                                      
  /Users/Niok/Documents/Work/so/ga-piclike/src/assets/js/wx.js:1:1
  ! function(a, b) { "function" == typeof define && (define.amd || define.cmd) ? define(function() {
   ^

应该是es6的问题，但是现在没有解决思路，所以前来提问

第一次使用vue写正式项目但是在这里卡住了。
还有开发模式时候的请求数据也有问题希望能得到解答。
谢谢

更新直接引入后的结果，在模块中无法找到这个wx

//更新
引入https://www.npmjs.com/package/weixin-js-sdk。
可以在app.js看到jweixin的引入。
import wx from 'weixin-js-sdk'
但是当我在组件下打印
console.log(wx)
控制台报 undefined;

//更新 已经解决
使用
https://www.npmjs.com/package/weixin-js-sdk

//更新些最终解决方案
一：安装 weixin-js-sdk 这个模块 npm install weixin-js-sdk --save-dev
二：开始使用 import wx from 'weixin-js-sdk'

然后就可以使用了。wx.config 然后使用接口了。不过现在我还有问题

Answer 1

好像可以这么用：

require(['../libs/jweixin-1.0.0.js'], function (wx) {
  console.log(wx)
})

参考：https://webpack.github.io/docs/code-splitting.html

上面还是不对！！！

如果不想改动jweixin-1.0.0.js，需要使用webpack的imports-loader（https://github.com/webpack/imports-loader），但要注意一个问题：https://github.com/webpack/imports-loader/issues/23

when using both 'babel-loader' and 'imports-loader', this=>window will not work #23

最终写成这样：

var wx = require('imports?this=>window!../libs/jweixin-1.0.0.js')
console.log(wx)

Answer 2

使用webpack的imports-loader 或者你使用<script></script> 然后使用

  externals: {
    'wx': 'jWeixin'
  },

在项目中使用

import wx from 'wx'

Answer 3

eslint 的关系，用vue-cli 创建的项目，代码格式检查很严格，你把 ！ function 中间的空格删掉试试，

Answer 4

在index.html里面用script标签引用就可以了

Answer 5

在webpack配置文件中把eslint干掉，咳咳...

Answer 6

将微信的sdk文件放在项目的 static 目录下，然后再引用。

类似于：

<script src="static/js/jquery-2.1.1.js"></script>

Answer 7

请问一下楼主最终是怎么解决的，我也碰到这个问题
import wx from 'weixin-js-sdk'
ready下
console.log(wx)
：undefined

Answer 8

你们怎么用的，在项目中

Answer 9

遇到了同样的问题 请问楼主这个怎么解决的