【问题解决】Jimp.js Module parse failed: Unexpected token (15251:14) | webpack无法打包扩展运算符 ...

问题描述

在使用jimp.js 加载时出现

报错显示是You may need an appropriate loader to handle this file type.无法加载该文件类型。

问题解决

猜测是使用了es6的语法，导致加载失败。
于是我把opts中的…语法去掉

发现可以正常加载。
应该就是这里的问题了。webpack.config应该是配置支持es6的语法的。但是webpack不支持扩展运算符。
这里解决方法有两个

1. 不使用扩展运算符
2. 安装扩展包

方法2的详细步骤

npm install babel-plugin-transform-object-rest-spread

npm install babel-preset-es2015

修改项目文件夹下的.babelrc文件

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "presets": [
    ["es2015", { "modules": false }]
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime","transform-object-rest-spread"]
}

新添加的节点es2015 和插件transform-object-rest-spread
如果你跟我一样，是第三方库的js使用了扩展运算符。那么修改webpack的配置文件。因为我这里是vue环境，配置文件为webpack.base.conf.js

在test包含js的这一行的include中添加一个resolve（“第三方库路径”）。就可以正常使用了。