Importing pdf.js in a chrome extension setting: "Uncaught SyntaxError: Unexpected token 'export'"

49 Views Asked by At

I currently work on a chrome extension designed to scrape pdf files from specific websites, modify them (splitting them in multiple file, remove sensitive information from them etc.) and rendering them on the fly. For this I want to use pdf-lib for the pdf manipulation and pdfjs-dist for rendering. I use webpack to bundle my JS and all my dependencies but i get this error when trying to load the extension on a website in chrome:

chrome-extension://c…build/pdf.mjs:18148 Uncaught SyntaxError: Unexpected token 'export'
chrome-extension://c…pdf.sandbox.mjs:239 Uncaught SyntaxError: Unexpected token 'export'
chrome-extension://c…df.worker.mjs:57169 Uncaught SyntaxError: Unexpected token 'export'

I used babel to transpile ES6 modules, here are my config files:

webpack.config.js:

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },
  resolve: {
    extensions: ['.js', '.mjs', '.json'],
  },
  module: {
    rules: [
      {
        test: /\.worker\.js$/,
        use: { loader: 'worker-loader' },
      },
      {
        test: /\.m?js$/,
        exclude: /node_modules\/(?!(pdfjs-dist)\/).*/, 
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env'],
          },
        },
      },
    ],
  },
  mode: 'development',
};

babel.config.json:

{
    "presets": [
      [
        "@babel/preset-env",
        {
          "loose": true,
          "modules": false
        }
      ]
    ]
  }

I have tried loading the modules directly inside the chrome extension, inside an html file, but nothing seems to work for pdfjs... Thank you so much for your help.

0

There are 0 best solutions below