Added webpack build config

This commit is contained in:
euvl
2016-11-14 15:46:35 +00:00
parent 0a1017bfc4
commit a13056c608
12 changed files with 102 additions and 56 deletions

View File

@@ -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'
}
}
},

View File

View File

@@ -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>

View File

@@ -6,6 +6,5 @@
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@@ -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);

View File

@@ -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"
}
}

View File

@@ -15,7 +15,7 @@
</template>
<script>
import Vue from 'vue';
import VueModal from './index';
import VueModal from './modal';
const props = {
name: {

View File

@@ -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
View 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
View 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
View 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
View 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;