Skip to content
This repository has been archived by the owner on Aug 4, 2021. It is now read-only.

Unexpected token parsing package.json #28

Closed
Falconerd opened this issue Dec 29, 2015 · 5 comments
Closed

Unexpected token parsing package.json #28

Falconerd opened this issue Dec 29, 2015 · 5 comments

Comments

@Falconerd
Copy link

Hi, I feel as if i'm missing something really obvious. I really want to adopt rollup. However, I'd like to be able to bundle for the browser as well - which I'm pretty sure this library does. Anyhow, I'll share my setup and the error I'm getting. If you could point me in the right direction that'd be awesome. Cheers!

index.js

import * as axios from 'axios';

console.log('axios:', axios);

rollup.config.js

import { rollup } from 'rollup';
import commonjs from 'rollup-plugin-commonjs';
import npm from 'rollup-plugin-npm';

export default {
  entry: 'index.js',
  dest: 'bundle.js',
  plugins: [
    npm({
      jsnext: true,
      main: true
    }),
    commonjs({
      include: 'node_modules/**'
    })
  ],
  format: 'iife'
};

command

rollup -c

output

Treating 'rollup' as external dependency
Treating 'rollup-plugin-commonjs' as external dependency
Treating 'rollup-plugin-npm' as external dependency
Treating 'buffer' as external dependency
Treating 'zlib' as external dependency
Treating 'url' as external dependency
Error parsing /home/falconerd/Projects/rollup-test3/node_modules/axios/package.json: Unexpected token (2:9) in /home/falconerd/Projects/rollup-test3/node_modules/axios/package.json
Type rollup --help for help, or visit https://github.com/rollup/rollup/wiki
@Rich-Harris
Copy link
Contributor

That's incredibly weird. Is /home/falconerd/Projects/rollup-test3/node_modules/axios/package.json valid JSON, or has it been corrupted somehow? Quick way to find out:

echo "var pkg = $(cat /home/falconerd/Projects/rollup-test3/node_modules/axios/package.json); console.log(pkg.name)" | node

@Falconerd
Copy link
Author

Hi Rich, the result of that command is axios.

Here's a gist of the package.json https://gist.github.com/Falconerd/13ad1f83c70a37850149

@Rich-Harris
Copy link
Contributor

Ah, I wonder if the problem is that Rollup expects JavaScript instead of JSON. Could you try adding the rollup-plugin-json plugin? (Shouldn't matter which order it goes in).

Also, it looks like axios has a browser field in its package.json that replaces built-in modules like buffer and zlib when it's being bundled for the browser. By default, rollup-plugin-npm will ignore these, but you can change that behaviour with browser: true (we've just released the version that supports this, you'll need to update).

So your config file should probably look like something along these lines:

import { rollup } from 'rollup';
import commonjs from 'rollup-plugin-commonjs';
import npm from 'rollup-plugin-npm';
import json from 'rollup-plugin-json';

export default {
  entry: 'index.js',
  dest: 'bundle.js',
  plugins: [
    npm({
      jsnext: true,
      main: true,
      browser: true
    }),
    commonjs({
      include: 'node_modules/**'
    }),
    json()
  ],
  format: 'iife'
};

@Falconerd
Copy link
Author

Yep, that works. Thanks, @Rich-Harris.

index

import axios from 'axios';
window.axios = axios;

in browser console

axios.get('/wee').then(function(response) { console.log('Weeee', response.status) }).catch(function(error) { console.error('some error', error) });
// Weee, 200

@lumixraku
Copy link

lumixraku commented Apr 23, 2018

HI~
@Rich-Harris

I followed your instruction, but I met another problem.

In my browser, it says
app.ts:27 Uncaught ReferenceError: tty is not defined

[!] Error: Could not load http (imported by /Users/hehe/Sites/node_demo/my-svelte-project/demo_coupon/node_modules/axios/lib/adapters/http.js): ENOENT: no such file or directory, open 'http'

It seems rollup use node version of axios not browser version.

Is there anything wrong with my config?

		resolve({
			preferBuiltins: false,
			jsnext: true,
			main: true,
			browser: true
		}),
		json(),

happycollision added a commit to flixpressllc/video-submission-component that referenced this issue Jun 21, 2018
Importing axios was causing problems until I figured out why at
rollup/rollup-plugin-commonjs#28
akm added a commit to akm/gae_go-datastore-goa-goon-viron-react-redux-example that referenced this issue Aug 29, 2018
akm added a commit to akm/gae_go-datastore-goa-goon-viron-react-redux-example that referenced this issue Aug 29, 2018
akm added a commit to akm/gae_go-datastore-goa-goon-viron-react-redux-example that referenced this issue Aug 30, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants