mirror of
				https://github.com/KevinMidboe/vue-js-modal.git
				synced 2025-10-29 18:00:20 +00:00 
			
		
		
		
	Added webpack build config
This commit is contained in:
		| @@ -1,6 +1,5 @@ | ||||
| module.exports = { | ||||
|   root: true, | ||||
|   fix: true, | ||||
|   parser: 'babel-eslint', | ||||
|   parserOptions: { | ||||
|     sourceType: 'module' | ||||
| @@ -12,7 +11,7 @@ module.exports = { | ||||
|   'settings': { | ||||
|     'import/resolver': { | ||||
|       'webpack': { | ||||
|         'config': 'build/webpack.base.conf.js' | ||||
|         'config': './webpack.base.config.js' | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   | ||||
| @@ -1,22 +1,18 @@ | ||||
| <template> | ||||
|   <div id="app"> | ||||
|     <img src="./assets/logo.png"> | ||||
|     <button @click="showModal">Show modal</button> | ||||
|     <h1>Test page</h1> | ||||
|     <button @click="showModal('basic')">Show basic modal</button> | ||||
|     <transition name="fade"> | ||||
|       <modal name="hello">Hello!</modal> | ||||
|       <modal name="basic">Hello! Im basic modal!</modal> | ||||
|     </transition> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import Hello from './components/Hello'; | ||||
|  | ||||
| export default { | ||||
|   name: 'app', | ||||
|   methods: { | ||||
|     showModal() { | ||||
|       this.$modal.toggle('hello', false); | ||||
|     }, | ||||
|     showModal(name) => this.$modal.show(name), | ||||
|   }, | ||||
| }; | ||||
| </script> | ||||
|   | ||||
| @@ -6,6 +6,5 @@ | ||||
|   </head> | ||||
|   <body> | ||||
|     <div id="app"></div> | ||||
|     <!-- built files will be auto injected --> | ||||
|   </body> | ||||
| </html> | ||||
|   | ||||
| @@ -1,6 +1,6 @@ | ||||
| import Vue from 'vue'; | ||||
| import App from './App'; | ||||
| import VueModal from './VueModal/index'; | ||||
| import VueModal from '../src/index'; | ||||
|  | ||||
| Vue.use(VueModal); | ||||
|  | ||||
|   | ||||
| @@ -10,13 +10,7 @@ | ||||
|     "type": "git", | ||||
|     "url": "git+https://github.com/euvl/vue-modal.git" | ||||
|   }, | ||||
|   "scripts": { | ||||
|     "dev": "node examples/server.js", | ||||
|     "build": "node build/build.js", | ||||
|     "lint": "eslint --fix --ext .js,.vue src" | ||||
|   }, | ||||
|   "devDependencies": { | ||||
|     "vue": "^2.0.1", | ||||
|     "babel-runtime": "^6.18.0", | ||||
|     "autoprefixer": "^6.4.0", | ||||
|     "babel-core": "^6.0.0", | ||||
| @@ -59,5 +53,8 @@ | ||||
|   "engines": { | ||||
|     "node": ">= 4.0.0", | ||||
|     "npm": ">= 3.0.0" | ||||
|   }, | ||||
|   "dependencies": { | ||||
|     "vue": "^2.0.5" | ||||
|   } | ||||
| } | ||||
|   | ||||
| @@ -15,7 +15,7 @@ | ||||
| </template> | ||||
| <script> | ||||
|   import Vue from 'vue'; | ||||
|   import VueModal from './index'; | ||||
|   import VueModal from './modal'; | ||||
|  | ||||
|   const props = { | ||||
|     name: { | ||||
|   | ||||
							
								
								
									
										38
									
								
								src/index.js
									
									
									
									
									
								
							
							
						
						
									
										38
									
								
								src/index.js
									
									
									
									
									
								
							| @@ -1,39 +1,3 @@ | ||||
| import Vue from 'vue'; | ||||
| import Modal from './Modal'; | ||||
|  | ||||
| const VueModal = { | ||||
|   event: new Vue(), | ||||
|   install(self, options = {}) { | ||||
|     if (this.installed) { | ||||
|       return console.log('Modal component is already installed.'); | ||||
|     } | ||||
|  | ||||
|     this.installed = true; | ||||
|  | ||||
|     const modal = { | ||||
|       toggle(name, state, params) { | ||||
|         const opts = typeof state === 'object' && typeof params === 'undefined' | ||||
|           ? state | ||||
|           : params; | ||||
|         VueModal.event.$emit('toggle', name, state); | ||||
|       }, | ||||
|       show(name, params = {}) { | ||||
|         VueModal.event.$emit('toggle', name, true); | ||||
|       }, | ||||
|       hide(name, params = {}) { | ||||
|         VueModal.event.$emit('toggle', name, false); | ||||
|       }, | ||||
|     }; | ||||
|  | ||||
|     Object.defineProperty(Vue.prototype, '$modal', { | ||||
|       get() { | ||||
|         return modal; | ||||
|       }, | ||||
|     }); | ||||
|  | ||||
|     Vue.component('modal', Modal); | ||||
|     return null; | ||||
|   }, | ||||
| }; | ||||
| import VueModal from './modal'; | ||||
|  | ||||
| export default VueModal; | ||||
|   | ||||
							
								
								
									
										39
									
								
								src/modal.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										39
									
								
								src/modal.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,39 @@ | ||||
| import Vue from 'vue'; | ||||
| import Modal from './Modal.vue'; | ||||
|  | ||||
| const VueModal = { | ||||
|   event: new Vue(), | ||||
|   install(self, options = {}) { | ||||
|     if (this.installed) { | ||||
|       return console.log('Modal component is already installed.'); | ||||
|     } | ||||
|  | ||||
|     this.installed = true; | ||||
|  | ||||
|     const modal = { | ||||
|       toggle(name, state, params) { | ||||
|         const opts = typeof state === 'object' && typeof params === 'undefined' | ||||
|           ? state | ||||
|           : params; | ||||
|         VueModal.event.$emit('toggle', name, state); | ||||
|       }, | ||||
|       show(name, params = {}) { | ||||
|         VueModal.event.$emit('toggle', name, true); | ||||
|       }, | ||||
|       hide(name, params = {}) { | ||||
|         VueModal.event.$emit('toggle', name, false); | ||||
|       }, | ||||
|     }; | ||||
|  | ||||
|     Object.defineProperty(Vue.prototype, '$modal', { | ||||
|       get() { | ||||
|         return modal; | ||||
|       }, | ||||
|     }); | ||||
|  | ||||
|     Vue.component('modal', Modal); | ||||
|     return null; | ||||
|   }, | ||||
| }; | ||||
|  | ||||
| export default VueModal; | ||||
							
								
								
									
										26
									
								
								webpack.base.config.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										26
									
								
								webpack.base.config.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,26 @@ | ||||
| module.exports = { | ||||
|   entry: './src/index.js', | ||||
|   output: { | ||||
|     path: './dist', | ||||
|     publicPath: 'dist/', | ||||
|     filename: 'vue-modal.js' | ||||
|   }, | ||||
|   module: { | ||||
|     loaders: [ | ||||
|       { | ||||
|         test: /\.vue$/, | ||||
|         loader: 'vue' | ||||
|       }, | ||||
|       { | ||||
|         test: /\.js$/, | ||||
|         loader: 'babel!eslint', | ||||
|         exclude: /node_modules/ | ||||
|       } | ||||
|     ] | ||||
|   }, | ||||
|   vue: { | ||||
|     loaders: { | ||||
|       js: 'babel!eslint' | ||||
|     } | ||||
|   } | ||||
| }; | ||||
							
								
								
									
										8
									
								
								webpack.dev.config.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										8
									
								
								webpack.dev.config.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,8 @@ | ||||
| var config = require('./webpack.base.config'); | ||||
|  | ||||
| config.devtool = 'eval-source-map'; | ||||
| config.devServer = { | ||||
|   noInfo: true | ||||
| }; | ||||
|  | ||||
| module.exports = config; | ||||
							
								
								
									
										18
									
								
								webpack.prod.config.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										18
									
								
								webpack.prod.config.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,18 @@ | ||||
| var webpack = require('webpack'); | ||||
| var config = require('./webpack.base.config'); | ||||
|  | ||||
| config.plugins = (config.plugins || []).concat([ | ||||
|   new webpack.DefinePlugin({ | ||||
|     'process.env': { | ||||
|       NODE_ENV: '"production"' | ||||
|     } | ||||
|   }), | ||||
|   new webpack.optimize.UglifyJsPlugin({ | ||||
|     compress: { | ||||
|       warnings: false | ||||
|     } | ||||
|   }), | ||||
|   new webpack.optimize.OccurenceOrderPlugin() | ||||
| ]); | ||||
|  | ||||
| module.exports = config; | ||||
		Reference in New Issue
	
	Block a user