mirror of
				https://github.com/KevinMidboe/vue-chartjs.git
				synced 2025-10-29 18:00:20 +00:00 
			
		
		
		
	Merge pull request #246 from apertureless/feature/dependency_and_build_fix
Feature/dependency and build fix
This commit is contained in:
		
							
								
								
									
										13
									
								
								.babelrc
									
									
									
									
									
								
							
							
						
						
									
										13
									
								
								.babelrc
									
									
									
									
									
								
							| @@ -1,5 +1,14 @@ | |||||||
| { | { | ||||||
|   "presets": ["es2015", "stage-2"], |   "presets": [ | ||||||
|   "plugins": ["transform-runtime"], |     ["@babel/preset-env", { | ||||||
|  |       "modules": false, | ||||||
|  |       "targets": { | ||||||
|  |         "browsers": [ | ||||||
|  |           "last 2 versions" | ||||||
|  |         ] | ||||||
|  |       } | ||||||
|  |     }], | ||||||
|  |     "@babel/stage-2" | ||||||
|  |   ], | ||||||
|   "comments": false |   "comments": false | ||||||
| } | } | ||||||
|   | |||||||
							
								
								
									
										19
									
								
								README.md
									
									
									
									
									
								
							
							
						
						
									
										19
									
								
								README.md
									
									
									
									
									
								
							| @@ -38,27 +38,14 @@ Simply run `yarn add vue-chartjs chart.js` | |||||||
| Or if you want to use it directly in the browser add | Or if you want to use it directly in the browser add | ||||||
|  |  | ||||||
| ```html | ```html | ||||||
| <script src="https://unpkg.com/vue-chartjs/dist/vue-chartjs.full.min.js"></script> | <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.min.js"></script> | ||||||
|  | <script src="https://unpkg.com/vue-chartjs/dist/vue-chartjs.min.js"></script> | ||||||
| ``` | ``` | ||||||
| to your scripts. See [Codepen](https://codepen.io/apertureless/pen/zEvvWM) | to your scripts. See [Codepen](https://codepen.io/apertureless/pen/zEvvWM) | ||||||
|  |  | ||||||
| ## Explanation of Different Builds |  | ||||||
| There are three different entry points. It depends on which build setup do you have. The dependencies are bundled or required as a peerDependency. |  | ||||||
|  |  | ||||||
| - Browser |  | ||||||
| - Browserify / Webpack 1 |  | ||||||
| - Webpack 2 |  | ||||||
|  |  | ||||||
| | Build | Chart.js | |  | ||||||
| |---|---| |  | ||||||
| | vue-chartjs.full.js | Bundled | |  | ||||||
| | vue-chartjs.full.min.js |  Bundled | |  | ||||||
| | vue-chartjs.js | peerDependency | |  | ||||||
| | vue-chartjs.min.js | peerDependency  | |  | ||||||
| | es/index* |  peerDependency | |  | ||||||
|  |  | ||||||
| ### Browser | ### Browser | ||||||
| You can use `vue-chartjs` directly in the browser without any build setup. Like in this [codepen](https://codepen.io/apertureless/pen/zEvvWM). For this case, please use the `vue-chartjs.full.min.js` which is the minified version. It has Chart.js bundled into it. And bundled to a UMD Module. So you only need that one file. | You can use `vue-chartjs` directly in the browser without any build setup. Like in this [codepen](https://codepen.io/apertureless/pen/zEvvWM). For this case, please use the `vue-chartjs.min.js` which is the minified version. You also need to add the Chart.js CDN script. | ||||||
|  |  | ||||||
| You can then simply register your component: | You can then simply register your component: | ||||||
|  |  | ||||||
|   | |||||||
| @@ -1,92 +0,0 @@ | |||||||
| // var vue = require('vue-loader') |  | ||||||
| var path = require('path') |  | ||||||
| var webpack = require('webpack') |  | ||||||
| var ExtractTextPlugin = require('extract-text-webpack-plugin') |  | ||||||
| var projectRoot = path.resolve(__dirname, '../') |  | ||||||
| var cssLoader = ExtractTextPlugin.extract('style-loader', 'css-loader') |  | ||||||
| const npmCfg = require('../package.json') |  | ||||||
| const vueLoaderConfig = require('./vue-loader.conf') |  | ||||||
|  |  | ||||||
| var banner = [ |  | ||||||
|   npmCfg.name + ' v' + npmCfg.version, |  | ||||||
|   '(c) ' + (new Date().getFullYear()) + ' ' + npmCfg.author, |  | ||||||
|   npmCfg.homepage |  | ||||||
| ].join('\n') |  | ||||||
|  |  | ||||||
| function resolve (dir) { |  | ||||||
|   return path.join(__dirname, '..', dir) |  | ||||||
| } |  | ||||||
|  |  | ||||||
| module.exports = { |  | ||||||
|   entry: { |  | ||||||
|     'vue-chartjs': './src/index.js' |  | ||||||
|   }, |  | ||||||
|   output: { |  | ||||||
|     filename: './dist/[name].full.js', |  | ||||||
|     library: 'VueChartJs', |  | ||||||
|     libraryTarget: 'umd', |  | ||||||
|     umdNamedDefine: true |  | ||||||
|   }, |  | ||||||
|   resolve: { |  | ||||||
|     extensions: ['.js', '.vue', '.json'], |  | ||||||
|     alias: { |  | ||||||
|       'vue$': 'vue/dist/vue.esm.js', |  | ||||||
|       '@': resolve('src') |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   module: { |  | ||||||
|     rules: [ |  | ||||||
|       { |  | ||||||
|         test: /\.(js|vue)$/, |  | ||||||
|         loader: 'eslint-loader', |  | ||||||
|         enforce: 'pre', |  | ||||||
|         include: [resolve('src'), resolve('test')], |  | ||||||
|         options: { |  | ||||||
|           formatter: require('eslint-friendly-formatter') |  | ||||||
|         } |  | ||||||
|       }, |  | ||||||
|       { |  | ||||||
|         test: /\.vue$/, |  | ||||||
|         loader: 'vue-loader', |  | ||||||
|         options: vueLoaderConfig |  | ||||||
|       }, |  | ||||||
|       { |  | ||||||
|         test: /\.js$/, |  | ||||||
|         loader: 'babel-loader', |  | ||||||
|         include: [resolve('src'), resolve('test')] |  | ||||||
|       }, |  | ||||||
|       { |  | ||||||
|         test: /\.css$/, |  | ||||||
|         loader: cssLoader |  | ||||||
|       }, |  | ||||||
|       { |  | ||||||
|         test: /\.s[a|c]ss$/, |  | ||||||
|         loader: ExtractTextPlugin.extract('style-loader', 'css-loader!sass-loader') |  | ||||||
|       }, |  | ||||||
|       { |  | ||||||
|         test: /\.json$/, |  | ||||||
|         loader: 'json-loader' |  | ||||||
|       } |  | ||||||
|     ] |  | ||||||
|   }, |  | ||||||
|   plugins: [ |  | ||||||
|     new webpack.BannerPlugin(banner) |  | ||||||
|   ] |  | ||||||
| } |  | ||||||
|  |  | ||||||
| if (process.env.NODE_ENV === 'production') { |  | ||||||
|  |  | ||||||
|   delete module.exports.devtool |  | ||||||
|   module.exports.plugins = [ |  | ||||||
|     new webpack.DefinePlugin({ |  | ||||||
|       'process.env': { |  | ||||||
|         NODE_ENV: '"production"' |  | ||||||
|       } |  | ||||||
|     }), |  | ||||||
|     new webpack.optimize.UglifyJsPlugin({ |  | ||||||
|       compress: { |  | ||||||
|         warnings: false |  | ||||||
|       } |  | ||||||
|     }) |  | ||||||
|   ] |  | ||||||
| } |  | ||||||
							
								
								
									
										17
									
								
								build/webpack.release.full.min.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										17
									
								
								build/webpack.release.full.min.js
									
									
									
									
										vendored
									
									
								
							| @@ -1,17 +0,0 @@ | |||||||
| var config = require('./webpack.release.full.js') |  | ||||||
| var webpack = require('webpack') |  | ||||||
|  |  | ||||||
| config.output.filename = config.output.filename.replace(/\.js$/, '.min.js') |  | ||||||
|  |  | ||||||
| delete config.devtool |  | ||||||
|  |  | ||||||
| config.plugins = [ |  | ||||||
|   new webpack.optimize.UglifyJsPlugin({ |  | ||||||
|     sourceMap: false, |  | ||||||
|     compress: { |  | ||||||
|       warnings: false |  | ||||||
|     } |  | ||||||
|   }) |  | ||||||
| ] |  | ||||||
|  |  | ||||||
| module.exports = config |  | ||||||
| @@ -26,7 +26,12 @@ module.exports = { | |||||||
|     umdNamedDefine: true |     umdNamedDefine: true | ||||||
|   }, |   }, | ||||||
|   externals: { |   externals: { | ||||||
|     'chart.js': 'chart.js' |     'chart.js': { | ||||||
|  |       root: 'Chart', | ||||||
|  |       commonjs: 'chart.js', | ||||||
|  |       commonjs2: 'chart.js', | ||||||
|  |       amd: 'chart.js' | ||||||
|  |     } | ||||||
|   }, |   }, | ||||||
|   resolve: { |   resolve: { | ||||||
|     extensions: ['.js', '.vue', '.json'], |     extensions: ['.js', '.vue', '.json'], | ||||||
| @@ -71,7 +76,8 @@ module.exports = { | |||||||
|     ] |     ] | ||||||
|   }, |   }, | ||||||
|   plugins: [ |   plugins: [ | ||||||
|     new webpack.BannerPlugin(banner) |     new webpack.BannerPlugin(banner), | ||||||
|  |     new webpack.optimize.ModuleConcatenationPlugin() | ||||||
|   ] |   ] | ||||||
| } | } | ||||||
|  |  | ||||||
|   | |||||||
							
								
								
									
										1
									
								
								build/webpack.release.min.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1
									
								
								build/webpack.release.min.js
									
									
									
									
										vendored
									
									
								
							| @@ -6,6 +6,7 @@ config.output.filename = config.output.filename.replace(/\.js$/, '.min.js') | |||||||
| delete config.devtool | delete config.devtool | ||||||
|  |  | ||||||
| config.plugins = [ | config.plugins = [ | ||||||
|  |   new webpack.optimize.ModuleConcatenationPlugin(), | ||||||
|   new webpack.optimize.UglifyJsPlugin({ |   new webpack.optimize.UglifyJsPlugin({ | ||||||
|     sourceMap: false, |     sourceMap: false, | ||||||
|     compress: { |     compress: { | ||||||
|   | |||||||
							
								
								
									
										34137
									
								
								dist/vue-chartjs.full.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										34137
									
								
								dist/vue-chartjs.full.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							
							
								
								
									
										1
									
								
								dist/vue-chartjs.full.min.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1
									
								
								dist/vue-chartjs.full.min.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										29
									
								
								package.json
									
									
									
									
									
								
							
							
						
						
									
										29
									
								
								package.json
									
									
									
									
									
								
							| @@ -1,6 +1,6 @@ | |||||||
| { | { | ||||||
|   "name": "vue-chartjs", |   "name": "vue-chartjs", | ||||||
|   "version": "3.0.0", |   "version": "3.0.1-rc2", | ||||||
|   "description": "Vue.js wrapper for chart.js for creating beautiful charts.", |   "description": "Vue.js wrapper for chart.js for creating beautiful charts.", | ||||||
|   "author": "Jakub Juszczak <jakub@posteo.de>", |   "author": "Jakub Juszczak <jakub@posteo.de>", | ||||||
|   "homepage": "http://vue-chartjs.org", |   "homepage": "http://vue-chartjs.org", | ||||||
| @@ -53,26 +53,21 @@ | |||||||
|     "e2e": "node test/e2e/runner.js", |     "e2e": "node test/e2e/runner.js", | ||||||
|     "test": "npm run unit", |     "test": "npm run unit", | ||||||
|     "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs", |     "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs", | ||||||
|     "release": "webpack --progress --hide-modules --config  ./build/webpack.release.js && NODE_ENV=production webpack --progress --hide-modules --config  ./build/webpack.release.min.js && webpack --progress --hide-modules --config  ./build/webpack.release.full.js && NODE_ENV=production webpack --progress --hide-modules --config  ./build/webpack.release.full.min.js", |     "release": "webpack --progress --hide-modules --config  ./build/webpack.release.js && NODE_ENV=production webpack --progress --hide-modules --config  ./build/webpack.release.min.js", | ||||||
|     "prepublish": "yarn run lint && yarn run test && yarn run build" |     "prepublishOnly": "yarn run lint && yarn run test && yarn run build" | ||||||
|   }, |   }, | ||||||
|   "dependencies": { |   "dependencies": { | ||||||
|     "isparta": "^4.0.0", |  | ||||||
|     "lodash.merge": "^4.6.0" |     "lodash.merge": "^4.6.0" | ||||||
|   }, |   }, | ||||||
|   "peerDependencies": { |   "peerDependencies": { | ||||||
|     "chart.js": "2.7.0", |     "chart.js": "2.7.x" | ||||||
|     "vue": "2.5.2" |  | ||||||
|   }, |   }, | ||||||
|   "devDependencies": { |   "devDependencies": { | ||||||
|     "babel-cli": "^6.24.1", |     "@babel/cli": "^7.0.0-beta.31", | ||||||
|     "babel-core": "^6.25.0", |     "@babel/core": "^7.0.0-beta.31", | ||||||
|     "babel-loader": "7.1.2", |     "@babel/preset-env": "^7.0.0-beta.31", | ||||||
|     "babel-plugin-transform-object-assign": "^6.22.0", |     "@babel/preset-stage-2": "^7.0.0-beta.31", | ||||||
|     "babel-plugin-transform-runtime": "^6.23.0", |     "babel-loader": "8.0.0-beta.0", | ||||||
|     "babel-preset-es2015": "^6.24.1", |  | ||||||
|     "babel-preset-stage-2": "^6.24.1", |  | ||||||
|     "babel-runtime": "^6.23.0", |  | ||||||
|     "chai": "^3.5.0", |     "chai": "^3.5.0", | ||||||
|     "chart.js": "2.7.0", |     "chart.js": "2.7.0", | ||||||
|     "chromedriver": "^2.28.0", |     "chromedriver": "^2.28.0", | ||||||
| @@ -98,6 +93,7 @@ | |||||||
|     "html-webpack-plugin": "^2.28.0", |     "html-webpack-plugin": "^2.28.0", | ||||||
|     "http-proxy-middleware": "^0.17.4", |     "http-proxy-middleware": "^0.17.4", | ||||||
|     "inject-loader": "^3.0.0", |     "inject-loader": "^3.0.0", | ||||||
|  |     "isparta": "^4.0.0", | ||||||
|     "jasmine-core": "^2.5.2", |     "jasmine-core": "^2.5.2", | ||||||
|     "json-loader": "^0.5.4", |     "json-loader": "^0.5.4", | ||||||
|     "karma": "^1.5.0", |     "karma": "^1.5.0", | ||||||
| @@ -137,11 +133,6 @@ | |||||||
|     "node": ">=6.9.0", |     "node": ">=6.9.0", | ||||||
|     "npm": ">= 3.0.0" |     "npm": ">= 3.0.0" | ||||||
|   }, |   }, | ||||||
|   "babel": { |  | ||||||
|     "presets": [ |  | ||||||
|       "es2015" |  | ||||||
|     ] |  | ||||||
|   }, |  | ||||||
|   "browserify": { |   "browserify": { | ||||||
|     "transform": [ |     "transform": [ | ||||||
|       "babelify" |       "babelify" | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user