Skip to content

Commit

Permalink
add details about UMD builds
Browse files Browse the repository at this point in the history
  • Loading branch information
jonathanong committed Apr 5, 2014
1 parent cd79846 commit e6bb3fb
Showing 1 changed file with 13 additions and 0 deletions.
13 changes: 13 additions & 0 deletions creating-components/standalone-umd-builds.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@

You may create a standalone build, including all dependencies, using the `component build --standalone <name>` command. This will create a [umd](https://github.com/umdjs/umd)-wrapped version of your build.

Services may automatically build UMD-wrapped standalone builds of components. However, it probably uses the component's `name` property as the global name by default. If you would like to use a custom name, for example, a capitalized name, then set `.standalone` as your preferred global name.

```json
{
"name": "emitter",
"standalone": "Emitter"
}
```

Note that this `.standalone` name is not in the `component.json` specification and is only relevant to automated builds. It does nothing when you locally build your components.

6 comments on commit e6bb3fb

@timaschew
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what you mean with Services may automatically build UMD-wrapped ?
An example how to use the standalone property would be nice

@jonathanong
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think that was a plan for a CDN, but I never followed through on that

@timaschew
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jonathanong another question:

You may create a standalone build, including all dependencies

But the dependencies are not provided for the AMD style, the dependencies for AMD are hardcoded [] if you check this line: https://github.com/componentjs/builder2.js/blob/master/lib/builders/scripts.js#L69

They should be provided this way: https://github.com/umdjs/umd/blob/master/returnExportsGlobal.js#L20 or I don't get the UMD stuff?

@jonathanong
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we package it UMD just for exporting. no dependencies are used outside of the build, AMD or otherwise

@timaschew
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Okay, I assumed that.

I'm not sure who is doing it wrong for this case:
there is this lib switchery which has a dependency to fastclick.
Both provide a component.json. Fastclick has a UMD in the client script:
https://github.com/ftlabs/fastclick/blob/master/lib/fastclick.js#L829-L840

Switchery just do a require('fastclick') in its client script and don't provide a UMD in the (raw) client script.
https://github.com/abpetkov/switchery/blob/master/switchery.js#L19

But the github repo of Switchery provide also a dist directory with a compeonnt --standalone build: https://github.com/abpetkov/switchery/blob/master/dist/switchery.js#L1546-L1552

Now @bartzy is using this dist file + RequireJS and it fails, because
IMO it's wrong to use the dist version of Switchery, if someone want to use it with RequireJS or what do you think?

// edit: here is the issue componentjs/component#627

@bartzy
Copy link

@bartzy bartzy commented on e6bb3fb Mar 12, 2015

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@timaschew
First of all, thanks for your time inspecting this issue!

Not only that it breaks with RequireJS, but actually 2 things happen:

  1. Switchery gets an empty object from require('fastclick'), since no module.exports = FastClick happens for FastClick (because exports doesn't exist in a RequireJS env).
  2. My whole RequireJS setup gets really weird - since FastClick defines an anonymous module with RequireJS's define method, in a file that has nothing to do with FastClick (It is the Switchery dist file).

Thanks for the help again!

Please sign in to comment.