Skip to content

Commit

Permalink
Add -suffix to README examples to reflect Webpack 2 change (#34)
Browse files Browse the repository at this point in the history
  • Loading branch information
@kevinzwhuang @SpaceK33z
kevinzwhuang authored and SpaceK33z committed Nov 17, 2016
1 parent d73e591 commit 6cdd994
Showing 1 changed file with 6 additions and 6 deletions.
12 changes: 6 additions & 6 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ $("img").doSomeAwesomeJqueryPluginStuff();
then you can inject the `$` variable into the module by configuring the imports-loader like this:

``` javascript
require("imports?$=jquery!./example.js");
require("imports-loader?$=jquery!./example.js");

This comment has been minimized.

Sign in to view

Copy link
@djindjic

djindjic Nov 17, 2016

@kevinzwhuang where should I place this line? in example.js or somewhere else?

This comment has been minimized.

Sign in to view

Copy link
@kevinzwhuang

kevinzwhuang Nov 17, 2016 •
edited
Loading

Author Contributor

This line goes into wherever your entry point is for your webpack bundle.

So if for example in your webpack.config.js, say your entry is entry.js - this line lives in entry.js.

Alternatively, you can always just put the loader in the config object itself, like so: https://github.com/webpack/imports-loader#webpackconfigjs

This comment has been minimized.

Sign in to view

Copy link
@djindjic

djindjic Nov 17, 2016

ahhh, thanks. Im looking for some solution how to import jquery and additional jquery plugins. Is it better to define jquery like this:

new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery",
            Highcharts: 'highcharts'
        }),

or with imports-loader? are they both made for the same purpose?

This comment has been minimized.

Sign in to view

Copy link
@kevinzwhuang

kevinzwhuang Nov 17, 2016

Author Contributor

They both serve the pretty much the same purpose, it's up to you.
I think it might be better for you to use ProvidePlugin since it will save you from loading another dependency and it might be easier to understand in your webpack config file. Though if you need more customization options, imports-loader might be worth looking at.
```

This simply prepends `var $ = require("jquery");` to `example.js`.
Expand All @@ -41,7 +41,7 @@ Query value | Equals
Multiple values are separated by comma `,`:

```javascript
require("imports?$=jquery,angular,config=>{size:50}!./file.js");
require("imports-loader?$=jquery,angular,config=>{size:50}!./file.js");
```

### webpack.config.js
Expand All @@ -57,7 +57,7 @@ module.exports = {
loaders: [
{
test: require.resolve("some-module"),
loader: "imports?this=>window"
loader: "imports-loader?this=>window"
}
]
}
Expand All @@ -70,11 +70,11 @@ module.exports = {

### jQuery plugins

`imports?$=jquery`
`imports-loader?$=jquery`

### Custom Angular modules

`imports?angular`
`imports-loader?angular`

### Disable AMD

Expand All @@ -83,7 +83,7 @@ There are many modules that check for a `define` function before using CommonJS.
Then you can easily disable the AMD path by writing

```javascript
imports?define=>false
imports-loader?define=>false
```
For further hints on compatibility issues, check out [Shimming Modules](http://webpack.github.io/docs/shimming-modules.html) of the official docs.
Expand Down

0 comments on commit 6cdd994

Please sign in to comment.