You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Fixes#18 Require of AutoNumeric is ES6 module and not the distribution version
Fix how using vue-autonumeric with a CDN did not work since the external library it searched was in lowercase.
Update the documentation about using `vue-autonumeric` in an ES6 module setup with Webpack
Important note:
- We need to use `<npmPath>: 'AutoNumeric'` in the `vue-autonumeric`'s webpack configuration since we want the user to be able to just use a CDN link to the AutoNumeric library and make sure `vue-autonumeric` will correctly use this name (since it's exported as `AutoNumeric`, with this case).
- However if you are using `vue-autonumeric` in an ES6 module setup with a bundling tool (ie. Webpack), then you'll need to declare in your project an alias so that Webpack will know how to recognize the correct library name case.
- The alias configuration example for Webpack:
```js
resolve: {
extensions: ['.js', '.vue', '.json'],
alias : {
'~' : resolve('node_modules'),
'@' : resolve('src'),
'AutoNumeric': resolve('node_modules/autonumeric/dist/autoNumeric.min'),
},
},
```
Signed-off-by: Alexandre Bonneau <[email protected]>
Copy file name to clipboardExpand all lines: CHANGELOG.md
+20Lines changed: 20 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,5 +1,25 @@
1
1
## Changelog for vue-autoNumeric
2
2
3
+
### 1.2.4
4
+
+ Fixes #18 Require of AutoNumeric is ES6 module and not the distribution version
5
+
+ Fix how using vue-autonumeric with a CDN did not work since the external library it searched was in lowercase.
6
+
+ Update the documentation about using `vue-autonumeric` in an ES6 module setup with Webpack
7
+
8
+
Important note:
9
+
+ We need to use `<npmPath>: 'AutoNumeric'` in the `vue-autonumeric`'s webpack configuration since we want the user to be able to just use a CDN link to the AutoNumeric library and make sure `vue-autonumeric` will correctly use this name (since it's exported as `AutoNumeric`, with this case).
10
+
+ However if you are using `vue-autonumeric` in an ES6 module setup with a bundling tool (ie. Webpack), then you'll need to declare in your project an alias so that Webpack will know how to recognize the correct library name case.
Copy file name to clipboardExpand all lines: README.md
+5-9Lines changed: 5 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -53,7 +53,7 @@ module.exports = {
53
53
};
54
54
```
55
55
56
-
#### ...or by importing it directly as a module
56
+
#### ...or by importing it directly as an ES6 module
57
57
58
58
You can choose to directly import the AutoNumeric library in your source code.<br>First, install the `autonumeric` dependency so that Webpack can find it using:
59
59
@@ -73,16 +73,12 @@ export default {
73
73
components: {
74
74
VueAutonumeric,
75
75
},
76
-
77
-
data() {
78
-
return {
79
-
//
80
-
};
81
-
},
82
76
}
83
77
```
84
78
85
-
However, when doing that if you want to be able to bundle all the scripts together with Webpack, you'll need to define an alias for the `AutoNumeric` library in your Webpack config like so:
79
+
However, when doing that if you want to be able to bundle all the scripts together with Webpack, you'll **need to define an alias for the `AutoNumeric` library in your Webpack config**, otherwise Webpack will complain about the npm package `autonumeric` case.
80
+
81
+
The alias that you need to declare in your Webpack configuration:
//XXX Note: You need to use `<npmPath>: 'AutoNumeric'` if you want to be able to just use a script CDN link to the AutoNumeric library, since it's exported as `AutoNumeric` (with this case) //FIXME But what happens when the user do not use a script link but directly import 'AutoNumeric' with `import AutoNumeric from 'autonumeric'`?
75
+
/*
76
+
* Important note:
77
+
* We need to use `<npmPath>: 'AutoNumeric'` here since we want the user to be able to just use a
78
+
* CDN link to the AutoNumeric library and make sure `vue-autonumeric` will correctly use this
79
+
* name (since it's exported as `AutoNumeric`, with this case).
80
+
*
81
+
* However if you are using `vue-autonumeric` in an ES6 module setup with a bundling tool
82
+
* (ie. Webpack), then you'll need to declare in your project an alias so that Webpack will know
0 commit comments