Dynamic import and Vue cannot be used with webpack loader

Code:

// index.js
async function main() {
  const mod = await import("./module");
  console.log(mod);
}
main();

// module.js
export const text = "Hello World";

Error:

ERROR in ./src/index.js
Module build failed (from (webpack)-obfuscator/dist/loader/index.js):
Error: SyntaxError: Unexpected token (2:20)
    at Function.parseCode (/Users/kevin/projects/webpack-obfuscator-demo/node_modules/webpack-obfuscator/dist/loader/index.js:63:23)
    at Function.getCommentedSource (/Users/kevin/projects/webpack-obfuscator-demo/node_modules/webpack-obfuscator/dist/loader/index.js:31:55)
    at Object.Loader (/Users/kevin/projects/webpack-obfuscator-demo/node_modules/webpack-obfuscator/dist/loader/index.js:84:63)

Webpack config:

// webpack.config.js
const path = require("path");
const WebpackObfuscator = require("webpack-obfuscator");

module.exports = {
  mode: "production",
  module: {
    rules: [
      {
        test: /\.js$/,
        include: [path.resolve(".", "src")],
        enforce: "post",
        use: {
          loader: WebpackObfuscator.loader,
          options: {
            rotateStringArray: true,
          },
        },
      },
    ],
  },
};

Hi. Try [email protected]

It works! Thank you. But there is an other problem. Not compatible with vue

Code:

// index.js

import App from "./App.vue";

new Vue({
  render: h => h(App),
  store,
}).$mount("#app");

<!-- App.vue -->
<template>
  <h1>Hello {{ text }}</h1>
</template>

<script>
export default {
  props: {
    text: String,
  },
};
</script>

Webpack Config

const path = require("path");
const WebpackObfuscator = require("webpack-obfuscator");
const VueLoaderPlugin = require("vue-loader/lib/plugin");

module.exports = {
  mode: "production",
  module: {
    rules: [
      { test: /\.vue$/, use: ["vue-loader"] },
      {
        test: /\.js$/,
        include: [path.resolve(".", "src")],
        enforce: "post",
        use: {
          loader: WebpackObfuscator.loader,
          options: {
            rotateStringArray: true,
          },
        },
      },
    ],
  },
  plugins: [new VueLoaderPlugin()],
};

Error:

ERROR in ./src/App.vue?vue&type=script&lang=js& 1:679
Module parse failed: Unexpected token (1:679)
File was processed with these loaders:
 * ./node_modules/webpack-obfuscator/dist/loader/index.js
 * ./node_modules/vue-loader/lib/loaders/pitcher.js
 * ./node_modules/vue-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
> var _0x27d9=['-!../node_modules/webpack-obfuscator/dist/loader/index.js??ref--1!../node_modules/vue-loader/lib/index.js??vue-loader-options!./App.vue?vue&type=script&lang=js&'];(function(_0x2af489,_0x27d9f0){var _0x556fe9=function(_0x2ff7da){while(--_0x2ff7da){_0x2af489['push'](_0x2af489['shift']());}};_0x556fe9(++_0x27d9f0);}(_0x27d9,0x118));var _0x556f=function(_0x2af489,_0x27d9f0){_0x2af489=_0x2af489-0x0;var _0x556fe9=_0x27d9[_0x2af489];return _0x556fe9;};import _0x3c560d from'-!../node_modules/webpack-obfuscator/dist/loader/index.js??ref--1!../node_modules/vue-loader/lib/index.js??vue-loader-options!./App.vue?vue&type=script&lang=js&';export default _0x3c560d;export*from_0x556f('0x0');
 @ ./src/App.vue 2:0-55 3:0-50 3:0-50 9:2-8
 @ ./src/index.js

Try to add vue-loader for .js files.

{
        test: /\.js$/,
        include: [path.resolve(".", "src")],
        enforce: "post",
        use: [
           {
               loader: WebpackObfuscator.loader,
               options: {
                   rotateStringArray: true,
               },
          },
          "vue-loader
      ]
}

Hmm the problem with exports

export * as foo from 'foo';

Obfuscator adds foo literal to the stringArray

Try to add vue-loader for .js files.

{
        test: /\.js$/,
        include: [path.resolve(".", "src")],
        enforce: "post",
        use: [
           {
               loader: WebpackObfuscator.loader,
               options: {
                   rotateStringArray: true,
               },
          },
          "vue-loader
      ]
}

It doesn't work. This will make all javascript code to be ignored.

export*from_0x556f('0x0');

It should be that the space was deleted and caused this problem

Not only space. Export path cannot be an identifier. Only literal.

export * as foo from FOO; // invalid
export * as foo from 'foo'; // valid

I cannot fix it right now, because escodegen does not support export * as constructions.
It removes as foo part.

So. I'll fix that literal value moved to the string array. But i cannot fix that as foo part was removed from this export because this is escodegen problem. I'll try to create the PR to that package, but it may be merged in few weeks or even months

Issue for export * as exports
#710

PR for export literals
#712

PR for escodegen
estools/escodegen#420

1.10.2 has been released with fixed sources of exports. Now these exports won't be moved to the StringArray or splitted by splitStrings option.

Support of named export * as is covered by this issue:
#710

I'll close this issue in favor of #710

Navigation Menu

Repository navigation

Dynamic import and Vue cannot be used with webpack loader #711

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Dynamic import and Vue cannot be used with webpack loader #711

Description

Activity

sanex3339 commented on Aug 14, 2020

sxzz commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sxzz commented on Aug 14, 2020

sxzz commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sanex3339 commented on Aug 14, 2020

sanex3339 commented on Aug 15, 2020

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions