mirror of
https://github.com/KevinMidboe/vue-chartjs.git
synced 2025-10-29 18:00:20 +00:00
Merge branch 'hotfix/minification'
* hotfix/minification: ⬆️ Update npm version 💎 Release new version v2.3.0 📝 Update README ✨ Add mixins to alias ⬆️ Update dependencies Change mixins exports to be seperate
This commit is contained in:
50
README.md
50
README.md
@@ -100,11 +100,58 @@ However you can simply implement this by your own or use one of the two mixins w
|
||||
- `reactiveProp`
|
||||
- `reactiveData`
|
||||
|
||||
Both are included in the `mixins` module.
|
||||
|
||||
The mixins automatically create `chartData` as a prop or data. And add a watcher. If data has changed, the chart will update.
|
||||
|
||||
```javascript
|
||||
// MonthlyIncome.js
|
||||
import { Line, reactiveProp } from 'vue-chartjs'
|
||||
import { Line, mixins } from 'vue-chartjs'
|
||||
|
||||
export default Line.extend({
|
||||
mixins: [mixins.reactiveProp],
|
||||
props: ["chartData", "options"],
|
||||
mounted () {
|
||||
this.renderChart(this.chartData, this.options)
|
||||
}
|
||||
})
|
||||
|
||||
```
|
||||
|
||||
### Mixins module
|
||||
The `mixins` module is included in the `VueCharts` module and as a seperate module.
|
||||
Some ways to import them:
|
||||
|
||||
```javascript
|
||||
// Load complete module with all charts
|
||||
import VueCharts from 'vue-chartjs'
|
||||
|
||||
export default VueCharts.Line.extend({
|
||||
mixins: [VueCharts.mixins.reactiveProp],
|
||||
props: ["chartData", "options"],
|
||||
mounted () {
|
||||
this.renderChart(this.chartData, this.options)
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
```javascript
|
||||
// Load speperate modules
|
||||
import { Line, mixins } from 'vue-chartjs'
|
||||
|
||||
export default Line.extend({
|
||||
mixins: [mixins.reactiveProp],
|
||||
props: ["chartData", "options"],
|
||||
mounted () {
|
||||
this.renderChart(this.chartData, this.options)
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
```javascript
|
||||
// Load speperate modules with destructure assign
|
||||
import { Line, mixins } from 'vue-chartjs'
|
||||
const { reactiveProp } = mixins
|
||||
|
||||
export default Line.extend({
|
||||
mixins: [reactiveProp],
|
||||
@@ -113,7 +160,6 @@ export default Line.extend({
|
||||
this.renderChart(this.chartData, this.options)
|
||||
}
|
||||
})
|
||||
|
||||
```
|
||||
|
||||
## Available Charts
|
||||
|
||||
@@ -16,8 +16,9 @@ module.exports = {
|
||||
extensions: ['', '.js', '.vue'],
|
||||
fallback: [path.join(__dirname, '../node_modules')],
|
||||
alias: {
|
||||
'vue': 'vue/dist/vue.js',
|
||||
'vue': 'vue/dist/vue.common.js',
|
||||
'src': path.resolve(__dirname, '../src'),
|
||||
'mixins': path.resolve(__dirname, '../src/mixins'),
|
||||
'BaseCharts': path.resolve(__dirname, '../src/BaseCharts')
|
||||
}
|
||||
},
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
const webpack = require('webpack')
|
||||
const base = require('./webpack.base.conf')
|
||||
const config = require('../config')
|
||||
var env = process.env.NODE_ENV === 'testing'
|
||||
? require('../config/test.env')
|
||||
: config.build.env
|
||||
|
||||
base.entry = {
|
||||
lib: './src/index.js'
|
||||
@@ -19,9 +22,7 @@ var webpackConfig = Object.assign({}, base)
|
||||
webpackConfig.devtool = '#source-map'
|
||||
webpackConfig.plugins = (webpackConfig.plugins || []).concat([
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': {
|
||||
NODE_ENV: '"production"'
|
||||
}
|
||||
'process.env.NODE_ENV': env
|
||||
}),
|
||||
new webpack.optimize.UglifyJsPlugin({
|
||||
compress: { warnings: false }
|
||||
|
||||
34
dist/vue-chartjs.js
vendored
34
dist/vue-chartjs.js
vendored
File diff suppressed because one or more lines are too long
2
dist/vue-chartjs.js.map
vendored
2
dist/vue-chartjs.js.map
vendored
File diff suppressed because one or more lines are too long
22
package.json
22
package.json
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "vue-chartjs",
|
||||
"version": "2.2.1",
|
||||
"description": "Vue wrapper for chart.js",
|
||||
"version": "2.3.0",
|
||||
"description": "vue.js wrapper for chart.js",
|
||||
"author": "Jakub Juszczak <jakub@nextindex.de>",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@@ -26,8 +26,8 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"babel-runtime": "^6.11.6",
|
||||
"chart.js": "^2.2.1",
|
||||
"vue": "^2.0.1"
|
||||
"chart.js": "^2.4.0",
|
||||
"vue": "^2.1.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-core": "^6.10.4",
|
||||
@@ -38,14 +38,14 @@
|
||||
"chai": "^3.5.0",
|
||||
"chromedriver": "^2.21.2",
|
||||
"connect-history-api-fallback": "^1.1.0",
|
||||
"cross-spawn": "^4.0.2",
|
||||
"css-loader": "^0.25.0",
|
||||
"cross-spawn": "^5.0.1",
|
||||
"css-loader": "^0.26.1",
|
||||
"eslint": "^3.7.1",
|
||||
"eslint-config-standard": "^6.2.0",
|
||||
"eslint-friendly-formatter": "^2.0.5",
|
||||
"eslint-loader": "^1.3.0",
|
||||
"eslint-plugin-html": "^1.3.0",
|
||||
"eslint-plugin-promise": "^2.0.1",
|
||||
"eslint-plugin-promise": "^3.4.0",
|
||||
"eslint-plugin-standard": "^2.0.1",
|
||||
"eventsource-polyfill": "^0.9.6",
|
||||
"express": "^4.13.3",
|
||||
@@ -54,7 +54,7 @@
|
||||
"function-bind": "^1.0.2",
|
||||
"html-webpack-plugin": "^2.8.1",
|
||||
"http-proxy-middleware": "^0.17.2",
|
||||
"inject-loader": "^2.0.1",
|
||||
"inject-loader": "^3.0.0-beta2",
|
||||
"isparta-loader": "^2.0.0",
|
||||
"jasmine-core": "^2.5.2",
|
||||
"json-loader": "^0.5.4",
|
||||
@@ -73,18 +73,18 @@
|
||||
"nightwatch": "^0.9.8",
|
||||
"ora": "^0.3.0",
|
||||
"phantomjs-prebuilt": "^2.1.13",
|
||||
"selenium-server": "^2.53.1",
|
||||
"selenium-server": "^3.0.1",
|
||||
"shelljs": "^0.7.4",
|
||||
"sinon": "^1.17.3",
|
||||
"sinon-chai": "^2.8.0",
|
||||
"url-loader": "^0.5.7",
|
||||
"vue-hot-reload-api": "^2.0.6",
|
||||
"vue-html-loader": "^1.2.3",
|
||||
"vue-loader": "^9.3.0",
|
||||
"vue-loader": "^10.0.2",
|
||||
"vue-style-loader": "^1.0.0",
|
||||
"webpack": "^1.13.2",
|
||||
"webpack-dev-middleware": "^1.4.0",
|
||||
"webpack-hot-middleware": "^2.6.0",
|
||||
"webpack-merge": "^0.14.1"
|
||||
"webpack-merge": "^1.1.1"
|
||||
}
|
||||
}
|
||||
|
||||
20
src/index.js
20
src/index.js
@@ -5,8 +5,7 @@ import Pie from './BaseCharts/Pie'
|
||||
import PolarArea from './BaseCharts/PolarArea'
|
||||
import Radar from './BaseCharts/Radar'
|
||||
import Bubble from './BaseCharts/Bubble'
|
||||
import reactiveProp from './mixins/reactiveProp'
|
||||
import reactiveData from './mixins/reactiveData'
|
||||
import mixins from './mixins/index.js'
|
||||
|
||||
const VueCharts = {
|
||||
Bar,
|
||||
@@ -16,8 +15,19 @@ const VueCharts = {
|
||||
PolarArea,
|
||||
Radar,
|
||||
Bubble,
|
||||
reactiveProp,
|
||||
reactiveData
|
||||
mixins
|
||||
}
|
||||
|
||||
module.exports = VueCharts
|
||||
export default VueCharts
|
||||
|
||||
export {
|
||||
VueCharts,
|
||||
Bar,
|
||||
Doughnut,
|
||||
Line,
|
||||
Pie,
|
||||
PolarArea,
|
||||
Radar,
|
||||
Bubble,
|
||||
mixins
|
||||
}
|
||||
|
||||
7
src/mixins/index.js
Normal file
7
src/mixins/index.js
Normal file
@@ -0,0 +1,7 @@
|
||||
import reactiveData from './reactiveData.js'
|
||||
import reactiveProp from './reactiveProp.js'
|
||||
|
||||
export default {
|
||||
reactiveData,
|
||||
reactiveProp
|
||||
}
|
||||
Reference in New Issue
Block a user