Error while transpiling with Rollup

[PlkMarudny]

Hi,

I am trying to import the library into a Svelte project transpiled with Rollup:

import * as audioContextTimers from 'audio-context-timers';

and getting an error:

node_modules\standardized-audio-context\build\es2019\factories\decode-audio-data.js (15:14)
SyntaxError: Unexpected token (15:14) in C:\...\node_modules\standardized-audio-context\build\es2019\factories\decode-audio-data.js
    at Parser.pp$4.raise (C:\...\node_modules\acorn\dist\acorn.js:2757:13)
    at Parser.pp.unexpected (C:\...\node_modules\acorn\dist\acorn.js:647:8)
    at Parser.pp$1.parseTryStatement (C:\...\node_modules\acorn\dist\acorn.js:1018:49)
    at Parser.pp$1.parseStatement (C:\...\node_modules\acorn\dist\acorn.js:784:32)
    at Parser.pp$1.parseBlock (C:\...\node_modules\acorn\dist\acorn.js:1112:23)
    at Parser.pp$3.parseFunctionBody (C:\...\node_modules\acorn\dist\acorn.js:2600:22)
    at Parser.pp$3.parseArrowExpression (C:\...\node_modules\acorn\dist\acorn.js:2561:8)
    at Parser.pp$3.parseParenArrowList (C:\...\node_modules\acorn\dist\acorn.js:2283:15)
    at Parser.pp$3.parseParenAndDistinguishExpression (C:\...\node_modules\acorn\dist\acorn.js:2249:19)
    at Parser.pp$3.parseExprAtom (C:\...\node_modules\acorn\dist\acorn.js:2163:41)````

[chrisguttandin]

Hi @PlkMarudny,

are you able to share you rollup config?

I guess the error could be resolved by using @rollup/plugin-babel and by making sure that it also transpiles the files inside the node_modules folder.

[PlkMarudny]

Here it is:

import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';

import livereload from 'rollup-plugin-livereload';
import { terser } from 'rollup-plugin-terser';
import autoPreprocess from 'svelte-preprocess';
import copy from "rollup-plugin-copy-assets";

import globals from "rollup-plugin-node-globals";
import builtins from 'rollup-plugin-node-builtins';

import modify from 'rollup-plugin-modify';
import replace from '@rollup/plugin-replace';
import exec from 'child_process';

import typescript from '@rollup/plugin-typescript';
import gzipPlugin from 'rollup-plugin-gzip';

import { version } from "./package.json";

const production = !process.env.ROLLUP_WATCH;

const template = "/* Asharq Breaking News version {VERSION} */";

const banner = () => {
    return new Promise((resolve, reject) => {
        exec.exec('git rev-parse --short HEAD', (error, stdout, stderr) => {
            resolve(template.replace('{VERSION}', stdout).replace('\n', ''));
        });
    });
}

export default {
    input: 'src/main.js',
    output: {
        sourcemap: false,
        format: 'iife',
        name: 'AsharqBreakingNewsApp',
        file: 'public/build/bnapp.js',
        banner: banner,
        intro: 'var global = typeof self !== undefined ? self : this;',
    },
    external: [],
    plugins: [
        modify({
            "{{config}}": "./config.prod",
            "VERSION": `version ${version}`
        }),
        replace({
            ...includeEnv(),
        }),
        // copy assets
        copy({
            assets: [
                // You can include directories
                "src/assets",
                // You can also include files
                //   "src/external/buffer.bin",
            ],
        }),

        svelte({
            // enable run-time checks when not in production
            dev: true,
            // we'll extract any component CSS out into
            // a separate file - better for performance
            css: css => {
                css.write('bn.css');
            },
            preprocess: autoPreprocess(),
            legacy: false
        }),

        // If you have external dependencies installed from
        // npm, you'll most likely need these plugins. In
        // some cases you'll need additional configuration -
        // consult the documentation for details:
        // https://github.com/rollup/plugins/tree/master/packages/commonjs
        resolve({
            browser: true,
            dedupe: importee => importee === 'svelte' || importee.startsWith('svelte/'),
            preferBuiltins: true
        }),
        commonjs(),
        globals(),
        typescript({
            sourceMap: false,
            inlineSourceMap: false,
            module: "ES2015"
        }),
        builtins({ preferBuiltins: true }),

        // In dev mode, call `npm run start` once
        // the bundle has been generated
        !production && serve(),

        // Watch the `public` directory and refresh the
        // browser on changes when not in production
        !production && livereload('public'),

        // If we're building for production (npm run build
        // instead of npm run dev), minify
        terser({
            compress: {
                unused: false,
                collapse_vars: false
            },
            ecma: "2017",
            ie8: false,
            safari10: false,
        }),
        gzipPlugin()
    ],
    watch: {
        clearScreen: false
    }
};

function serve() {
    let started = false;

    return {
        writeBundle() {
            if (!started) {
                started = true;

                require('child_process').spawn('npm', ['run', 'start', '--', '--dev'], {
                    stdio: ['ignore', 'inherit', 'inherit'],
                    shell: true
                });
            }
        }
    };
}

[PlkMarudny]

Actually, it looks like 5.0.44 causes problems, 5.0.43 seems to be fine. I observed this while using snowpack with remote imports; snowpack chokes on 5.0.44, while having no issues with 5.0.43, link here: 2653

[chrisguttandin]

Thanks for the update. Do you maybe use Node.js v15? I noticed that it introduces some breaking changes and for example throws an ERR_INVALID_ARG_TYPE error which Node.js v14 would just ignore or handle gracefully. Maybe it's worth a try to downgrade to Node.js v14?

[PlkMarudny]

I use 14.5.1 unfortunately

[chrisguttandin]

I tried to replicate the error with a simple rollup config but wasn't successful. It all worked as expected.

I looks like there was no real difference between 5.0.43 and 5.0.44. It was triggered by my automatic release tool.

https://diff.intrinsic.com/audio-context-timers/5.0.43/5.0.44

The only difference is that two dependencies got an update. Those dependencies were @babel/runtime and fast-unique-numbers. The update of fast-unique-numbers was triggered by the update of @babel/runtime as well.

https://diff.intrinsic.com/fast-unique-numbers/5.0.23/5.0.24

And as it turns out the only change that happened to @babel/runtime was the version number.

https://diff.intrinsic.com/@babel/runtime/7.12.13/7.12.18

Long story short: I have no idea what is causing the problem. 🤷‍♂️

[PlkMarudny]

Hmm, let me make more tests then in different environments.

On Mon, Feb 22, 2021, 21:22 Christoph Guttandin notifications@github.com wrote:

I tried to replicate the error with a simple rollup config but wasn't successful. It all worked as expected.

I looks like there was no real difference between 5.0.43 and 5.0.44. It was triggered by my automatic release tool.

https://diff.intrinsic.com/audio-context-timers/5.0.43/5.0.44

The only difference is that two dependencies got an update. Those dependencies were @babel/runtime and fast-unique-numbers. The update of fast-unique-numbers was triggered by the update of @babel/runtime as well.

https://diff.intrinsic.com/fast-unique-numbers/5.0.23/5.0.24

And as it turns out the only change that happened to @babel/runtime was the version number.

https://diff.intrinsic.com/@babel/runtime/7.12.13/7.12.18

Long story short: I have no idea what is causing the problem. 🤷‍♂️

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/chrisguttandin/audio-context-timers/issues/453#issuecomment-783535598, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABBI2522VXSVANY7X7FUXYTTAKHG5ANCNFSM4XYGE3HA .