Spliting de modulos con require.ensure
This commit is contained in:
parent
aa85fade20
commit
3f36562dae
|
@ -1 +1,3 @@
|
||||||
import {ng} from '@salix/vendor'
|
import {bootstrap} from './bootstrap';
|
||||||
|
import * as spliting from './spliting'
|
||||||
|
bootstrap();
|
|
@ -0,0 +1,17 @@
|
||||||
|
import {ng} from '@salix/vendor';
|
||||||
|
import {NAME} from '@salix/core';
|
||||||
|
|
||||||
|
export const bootstrap = () => {
|
||||||
|
const selector = 'selector'
|
||||||
|
|
||||||
|
let _script = document.currentScript || (() => {
|
||||||
|
let scripts = document.getElementsByTagName('script');
|
||||||
|
return scripts[scripts.length - 1];
|
||||||
|
})();
|
||||||
|
|
||||||
|
let _element = _script && document.querySelector(_script.getAttribute(selector));
|
||||||
|
if (!_element) {
|
||||||
|
throw new Error("element is not defined");
|
||||||
|
}
|
||||||
|
ng.bootstrap(_element, [NAME]);
|
||||||
|
};
|
|
@ -0,0 +1,20 @@
|
||||||
|
const crud = () => {
|
||||||
|
require.ensure([], () => {
|
||||||
|
require('@salix/crud')
|
||||||
|
}, "salix.crud");
|
||||||
|
};
|
||||||
|
const compras = () => {
|
||||||
|
require.ensure([], () => {
|
||||||
|
require('@salix/compras')
|
||||||
|
}, "salix.compras");
|
||||||
|
};
|
||||||
|
const ventas = () => {
|
||||||
|
require.ensure([], () => {
|
||||||
|
require('@salix/ventas')
|
||||||
|
}, "salix.ventas");
|
||||||
|
};
|
||||||
|
const pagos = () => {
|
||||||
|
require.ensure([], () => {
|
||||||
|
require('@salix/pagos')
|
||||||
|
}, "salix.pagos");
|
||||||
|
};
|
|
@ -0,0 +1,4 @@
|
||||||
|
import * as core from '@salix/core'
|
||||||
|
import * as vendors from '@salix/vendor'
|
||||||
|
import * as crud from '@salix/crud'
|
||||||
|
console.log('compras');
|
|
@ -7,7 +7,6 @@ import * as util from '../util';
|
||||||
export const NAME = util.getName(BUTTON_NAME);
|
export const NAME = util.getName(BUTTON_NAME);
|
||||||
|
|
||||||
directive.$inject =[resolveFactory.NAME];
|
directive.$inject =[resolveFactory.NAME];
|
||||||
|
|
||||||
export function directive (resolve){
|
export function directive (resolve){
|
||||||
return{
|
return{
|
||||||
require:'E',
|
require:'E',
|
||||||
|
|
|
@ -1,9 +1,7 @@
|
||||||
import {ng} from '@salix/vendor';
|
import * as vendors from '@salix/vendor';
|
||||||
import {EMPTYDEPENDECIES} from './constants';
|
import {getModuleName,getVendorDependencies} from './util';
|
||||||
import {getModuleName} from './util';
|
|
||||||
|
|
||||||
|
|
||||||
|
const DEPENDENCIES = getVendorDependencies(vendors)
|
||||||
export const NAME = getModuleName('core');
|
export const NAME = getModuleName('core');
|
||||||
|
export const module = vendors.ng.module(NAME,DEPENDENCIES);
|
||||||
export const module = ng.module(NAME,EMPTYDEPENDECIES);
|
|
||||||
|
|
||||||
|
|
|
@ -34,4 +34,14 @@ export function getProviderName(name){
|
||||||
|
|
||||||
export function getTemplateName(componentName,frameworkName){
|
export function getTemplateName(componentName,frameworkName){
|
||||||
return componentName + '.' + frameworkName + '.' + '.html'
|
return componentName + '.' + frameworkName + '.' + '.html'
|
||||||
|
}
|
||||||
|
export function getVendorDependencies(vendors){
|
||||||
|
let dependencies = [];
|
||||||
|
Object.keys(vendors).forEach((vendor)=>{
|
||||||
|
let name = vendors[vendor].name;
|
||||||
|
if(name){
|
||||||
|
dependencies.push(name)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return dependencies;
|
||||||
}
|
}
|
|
@ -0,0 +1,3 @@
|
||||||
|
import * as vendors from '@salix/vendor'
|
||||||
|
import * as core from '@salix/core'
|
||||||
|
console.log('crud');
|
|
@ -0,0 +1,6 @@
|
||||||
|
import * as core from '@salix/core'
|
||||||
|
import * as vendors from '@salix/vendor'
|
||||||
|
import * as crud from '@salix/crud'
|
||||||
|
import * as ventas from '@salix/ventas'
|
||||||
|
import * as compras from '@salix/compras'
|
||||||
|
console.log('pagos')
|
|
@ -0,0 +1,4 @@
|
||||||
|
import * as core from '@salix/core'
|
||||||
|
import * as vendors from '@salix/vendor'
|
||||||
|
import * as crud from '@salix/crud'
|
||||||
|
console.log('ventas');
|
21
index.html
21
index.html
|
@ -1,14 +1,13 @@
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
|
||||||
<title>Salix</title>
|
<head>
|
||||||
</head>
|
<title>Salix</title>
|
||||||
<div id ="app">
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app">
|
||||||
|
{{1+1}}
|
||||||
</div>
|
</div>
|
||||||
<body>
|
<script type="text/javascript" src="build/salix.app.js" selector="#app"></script>
|
||||||
<script type="text/javascript" src="build/salix.vendor.js"></script>
|
</body>
|
||||||
<script type="text/javascript" src="build/salix.core.js"></script>
|
</html>
|
||||||
<script type="text/javascript" src="build/salix.app.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,44 +1,38 @@
|
||||||
|
|
||||||
var webpack = require ('webpack');
|
var webpack = require('webpack');
|
||||||
var path = require ('path');
|
var path = require('path');
|
||||||
|
|
||||||
module.exports =
|
module.exports =
|
||||||
{
|
{
|
||||||
entry: {
|
entry: {
|
||||||
'salix.vendor': ['@salix/vendor'],
|
'salix.app': ['@salix/app']
|
||||||
'salix.core': ['@salix/core'],
|
},
|
||||||
'salix.app': ['@salix/app']
|
output: {
|
||||||
},
|
path: path.join(__dirname, 'build'),
|
||||||
output: {
|
filename: '[name].js',
|
||||||
path: path.join (__dirname, 'build'),
|
publicPath: 'build/',
|
||||||
filename: '[name].js',
|
chunkFilename: "[name].js"
|
||||||
publicPath: 'build/'
|
},
|
||||||
},
|
module: {
|
||||||
module: {
|
loaders: [
|
||||||
loaders: [
|
{
|
||||||
{
|
test: /\.js$/,
|
||||||
test: /\.js$/,
|
loader: 'babel',
|
||||||
loader: 'babel',
|
exclude: /node_modules/,
|
||||||
exclude: /node_modules/,
|
query: {
|
||||||
query: {
|
presets: ['es2015']
|
||||||
presets: ['es2015']
|
}
|
||||||
|
}, {
|
||||||
|
test: /\.html$/,
|
||||||
|
loader: 'raw'
|
||||||
}
|
}
|
||||||
},{
|
]
|
||||||
test: /\.html$/,
|
},
|
||||||
loader: 'raw'
|
resolve: {
|
||||||
}
|
modulesDirectories: [
|
||||||
]
|
__dirname,
|
||||||
},
|
'node_modules'
|
||||||
resolve: {
|
]
|
||||||
modulesDirectories: [
|
}
|
||||||
__dirname,
|
};
|
||||||
'node_modules'
|
|
||||||
]
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
new webpack.optimize.CommonsChunkPlugin ({
|
|
||||||
name: 'salix.vendor'
|
|
||||||
})
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue