mirror of
https://github.com/portainer/portainer.git
synced 2025-08-02 20:35:25 +02:00
refactor(app): introduce webpack and babel (#2407)
* feat(agent): add new host page * feat(agent): convert volume-browser to files-datatable * fix(agent): browse folders in file-datatable * feat(engine-details): replace engine view with host view * feat(engine-details): remove old panels * feat(engine-details): add basic engine-details-panel component * feat(engine-details): pass details to the different components * feat(engine-details): replace host-view with host-overview * feat(engine-details): add commaseperated filter * feat(engine-details): add host-view container component * feat(engine-details): add host-details component * feat(engine-details): build host details object * feat(engine-details): format engine version * feat(engine-details): get details for one node * feat(engine-details): pass is-agent from view * feat(engine-details): replace old node view with a new component * feat(engine-details): add swarm-node-details component * feat(engine-details): remove isSwarm binding * feat(engine-details): remove node-details and include in parent * feat(engine-details): add labels-table component * feat(engine-details): add update node service * feat(engine-details): add update label functionality * style(engine-details): remove whitespaces * feat(engine-details): remove old node page * feat(engine-details): pass is agent to host details * feat(host-details): hide missing info * feat(host-details): update node availability * style(host-details): remove obsolete event object * feat(host-details): fix labels not sending * feat(host-details): remove flags for hiding data * feat(host-details): create mock call to server for agent host info * style(host-details): fix spelling mistake in filter's name * feat(host-details): get info from agent * feat(host-details): hide engine labels when empty * feat(node-details): move labels table and save button * feat(host-info): add different urls for refresh * feat(host-details): show disk/devices info for agent * feat(host-view): add loading indicator to devices-panel * feat(host-details): add loading indicator to disks panel * feat(agent): fix browse volume * feat(agent): browse files * feat(agent): enable rename * feat(agent): download file * fix(agent): download file from root * feat(agent): delete file * style(agent): remove whitespaces * fix(agent): fix link on node browser * feat(agent): basic file uploader * feat(agent): add basic file upload * fix(volume-browser): move volume id to query params * feat(node-browser): moved uploader into browser * feat(node-browser): add upload spinner * feat(agent): browse files relative to root * feat(build): add webpack build config * feat(build): add missing imports * feat(webpack): add missing imports * feat(build): enable eslint on build * feat(build): add webpack notifier * feat(build): clean terminal on build * feat(build): import all globals * feat(build): add angular import * feat(build): fix styles * feat(build): load favicons * feat(build): load css before script * feat(webpack): split vendors css and js to a different bundle * feat(webpack): import angular in all files * feat(webpack): remove eslint global config * feat(webpack): add webpack clean dist * feat(webpack): fix styling issues * refactor(webpack): remove empty controllers * refactor(webpack): optimize moment * refactor(webpack): add bundle analyzer * feat(webpack): add babel * refactor(webpack): optimize lodash * refactor(toastr): update toastr * feat(webpack): create basic production and dev config * fix(webpack): fix production config * fix(webpack): fix html templates url * refactor(webpack): remove angular imports * refactor(webpack): remove more angular imports * refactor(webpack): return angular to entry file * style(webpack): remove comments from config * fix(hosts): remove browse button * fix(webpack): import lodash * fix(webpack): import missing htmls * feat(webpack): reduce lodash size * feat(webpack): config grunt to use webpack * feat(webpack): add postcss * chore(codeclimate): use eslint-5 channel * feat(deps): upgrade from lodash to lodash-es * fix(webpack): fix bug with lodash * chore(build): add build client script * fix(webpack): fix missing jsyaml reference * refactor(webpack): seperate builds of img files * chore(build): add a way to check times of webpack build * feat(webpack): add dev server * fix(webpack): fix css output name * chore(webpack): optimize images * chore(webpack): add node env * fix(build): copy templates on release * chore(webpack): set env NODE_ENV * feat(webpack): set NODE_ENV on production builds * fix(extensions): set image path * refactor(css): move vendor css to js import * style(app): remove whitespaces * fix(build-system): allow DevOps pipeline to leverage webpack (#2670) * Update devopsbuild task to use webpack & remove AppVeyor environment var * Added -Force to replace the existing dist folder * Removed Test-Path * dep(build-system): add angularjs-annotate to webpack + fix on imports * Merge branch 'develop' into webpack * refactor(app): webpack aliases for imports + async / await dep + start refactor * style(extensions): use develop version of the view * fix(app): fix several issues introduced by webpack migration * fix(webpack): fix ng-include not loading templates with webpack * Fix Windows CI with Webpack (#2782) * fix(configs): refactor broke configs creation and list views * fix(build-system): update build_binary_devops for Windows
This commit is contained in:
parent
14845a4a53
commit
45113a7ff4
308 changed files with 8798 additions and 1050 deletions
273
gruntfile.js
273
gruntfile.js
|
@ -1,3 +1,5 @@
|
|||
const webpackDevConfig = require('./webpack/webpack.develop');
|
||||
const webpackProdConfig = require('./webpack/webpack.production');
|
||||
var gruntfile_cfg = {};
|
||||
var loadGruntTasks = require('load-grunt-tasks');
|
||||
var os = require('os');
|
||||
|
@ -5,81 +7,70 @@ var arch = os.arch();
|
|||
if (arch === 'x64') arch = 'amd64';
|
||||
|
||||
module.exports = function(grunt) {
|
||||
|
||||
loadGruntTasks(grunt, {
|
||||
pattern: ['grunt-*', 'gruntify-*']
|
||||
});
|
||||
|
||||
grunt.registerTask('default', ['eslint', 'build']);
|
||||
grunt.registerTask('before-copy', [
|
||||
'vendor',
|
||||
'html2js',
|
||||
'useminPrepare:release',
|
||||
'concat',
|
||||
'clean:tmpl',
|
||||
'replace',
|
||||
'postcss:build',
|
||||
'uglify'
|
||||
]);
|
||||
grunt.registerTask('after-copy', [
|
||||
'filerev',
|
||||
'usemin',
|
||||
'clean:tmp'
|
||||
]);
|
||||
|
||||
grunt.registerTask('build-webapp', [
|
||||
'config:prod',
|
||||
'env:prod',
|
||||
'clean:all',
|
||||
'before-copy',
|
||||
'copy:assets',
|
||||
'after-copy'
|
||||
]);
|
||||
'copy:templates',
|
||||
'webpack:prod']);
|
||||
|
||||
grunt.registerTask('build', [
|
||||
'config:dev',
|
||||
'clean:app',
|
||||
'shell:buildBinary:linux:' + arch,
|
||||
'shell:downloadDockerBinary:linux:' + arch,
|
||||
'vendor',
|
||||
'html2js',
|
||||
'useminPrepare:dev',
|
||||
'concat',
|
||||
'clean:tmpl',
|
||||
'replace',
|
||||
'copy',
|
||||
'after-copy'
|
||||
'copy:templates',
|
||||
'webpack:dev'
|
||||
]);
|
||||
grunt.task.registerTask('release', 'release:<platform>:<arch>', function(p, a) {
|
||||
grunt.task.run(['config:prod', 'clean:all', 'shell:buildBinary:' + p + ':' + a, 'shell:downloadDockerBinary:' + p + ':' + a, 'before-copy', 'copy:assets', 'after-copy']);
|
||||
});
|
||||
|
||||
grunt.task.registerTask('devopsbuild', 'devopsbuild:<platform>:<arch>', function(p, a) {
|
||||
grunt.task.run(['config:prod', 'clean:all', 'shell:buildBinaryOnDevOps:' + p + ':' + a, 'shell:downloadDockerBinary:' + p + ':' + a, 'before-copy', 'copy:assets', 'after-copy']);
|
||||
});
|
||||
grunt.registerTask('build-server', [
|
||||
'shell:buildBinary:linux:' + arch,
|
||||
'shell:downloadDockerBinary:linux:' + arch,
|
||||
'copy:templates',
|
||||
'shell:run:' + arch
|
||||
]);
|
||||
|
||||
grunt.task.registerTask('release', 'release:<platform>:<arch>',
|
||||
function (p = 'linux', a = arch) {
|
||||
grunt.task.run([
|
||||
'config:prod',
|
||||
'env:prod',
|
||||
'clean:all',
|
||||
'copy:templates',
|
||||
'shell:buildBinary:' + p + ':' + a,
|
||||
'shell:downloadDockerBinary:' + p + ':' + a,
|
||||
'webpack:prod'
|
||||
]);
|
||||
});
|
||||
|
||||
grunt.task.registerTask('devopsbuild', 'devopsbuild:<platform>:<arch>',
|
||||
function(p, a) {
|
||||
grunt.task.run([
|
||||
'config:prod',
|
||||
'env:prod',
|
||||
'clean:all',
|
||||
'copy:templates',
|
||||
'shell:buildBinaryOnDevOps:' + p + ':' + a,
|
||||
'shell:downloadDockerBinary:' + p + ':' + a,
|
||||
'webpack:prod'
|
||||
]);
|
||||
});
|
||||
|
||||
grunt.registerTask('lint', ['eslint']);
|
||||
grunt.registerTask('run-dev', ['build', 'shell:run', 'watch:build']);
|
||||
grunt.registerTask('clear', ['clean:app']);
|
||||
|
||||
// Load content of `vendor.yml` to src.jsVendor, src.cssVendor and src.angularVendor
|
||||
grunt.registerTask('vendor', function() {
|
||||
var vendorFile = grunt.file.readYAML('vendor.yml');
|
||||
for (var filelist in vendorFile) {
|
||||
if (vendorFile.hasOwnProperty(filelist)) {
|
||||
var list = vendorFile[filelist];
|
||||
// Check if any of the files is missing
|
||||
for (var itemIndex in list) {
|
||||
if (list.hasOwnProperty(itemIndex)) {
|
||||
var item = 'node_modules/' + list[itemIndex];
|
||||
if (!grunt.file.exists(item)) {
|
||||
grunt.fail.warn('Dependency file ' + item + ' not found.');
|
||||
}
|
||||
list[itemIndex] = item;
|
||||
}
|
||||
}
|
||||
// If none is missing, save the list
|
||||
grunt.config('src.' + filelist + 'Vendor', list);
|
||||
}
|
||||
}
|
||||
});
|
||||
grunt.registerTask('run-dev', [
|
||||
'config:dev',
|
||||
'build-server',
|
||||
'webpack:devWatch'
|
||||
]);
|
||||
grunt.registerTask('clear', ['clean:app']);
|
||||
|
||||
// Project configuration.
|
||||
grunt.initConfig({
|
||||
|
@ -91,30 +82,34 @@ module.exports = function(grunt) {
|
|||
config: gruntfile_cfg.config,
|
||||
src: gruntfile_cfg.src,
|
||||
clean: gruntfile_cfg.clean,
|
||||
useminPrepare: gruntfile_cfg.useminPrepare,
|
||||
filerev: { files: { src: ['<%= distdir %>/js/*.js', '<%= distdir %>/css/*.css'] } },
|
||||
usemin: { html: ['<%= distdir %>/index.html'] },
|
||||
copy: gruntfile_cfg.copy,
|
||||
eslint: gruntfile_cfg.eslint,
|
||||
html2js: gruntfile_cfg.html2js,
|
||||
concat: gruntfile_cfg.concat,
|
||||
uglify: gruntfile_cfg.uglify,
|
||||
postcss: gruntfile_cfg.postcss,
|
||||
watch: gruntfile_cfg.watch,
|
||||
shell: gruntfile_cfg.shell,
|
||||
replace: gruntfile_cfg.replace
|
||||
copy: gruntfile_cfg.copy,
|
||||
webpack: gruntfile_cfg.webpack,
|
||||
env: gruntfile_cfg.env
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
/***/
|
||||
|
||||
var autoprefixer = require('autoprefixer');
|
||||
var cssnano = require('cssnano');
|
||||
gruntfile_cfg.env = {
|
||||
dev: {
|
||||
NODE_ENV: 'development'
|
||||
},
|
||||
prod: {
|
||||
NODE_ENV: 'production'
|
||||
}
|
||||
}
|
||||
|
||||
gruntfile_cfg.webpack = {
|
||||
dev: webpackDevConfig,
|
||||
prod: webpackProdConfig,
|
||||
devWatch: Object.assign({ watch: true }, webpackDevConfig)
|
||||
};
|
||||
|
||||
gruntfile_cfg.config = {
|
||||
dev: { options: { variables: { 'environment': 'development' } } },
|
||||
prod: { options: { variables: { 'environment': 'production' } } }
|
||||
dev: { options: { variables: { environment: 'development' } } },
|
||||
prod: { options: { variables: { environment: 'production' } } }
|
||||
};
|
||||
|
||||
gruntfile_cfg.src = {
|
||||
|
@ -127,50 +122,18 @@ gruntfile_cfg.src = {
|
|||
|
||||
gruntfile_cfg.clean = {
|
||||
all: ['<%= root %>/*'],
|
||||
app: ['<%= distdir %>/*', '!<%= distdir %>/../portainer*', '!<%= distdir %>/../docker*'],
|
||||
app: [
|
||||
'<%= distdir %>/*',
|
||||
'!<%= distdir %>/../portainer*',
|
||||
'!<%= distdir %>/../docker*'
|
||||
],
|
||||
tmpl: ['<%= distdir %>/templates'],
|
||||
tmp: ['<%= distdir %>/js/*', '!<%= distdir %>/js/app.*.js', '<%= distdir %>/css/*', '!<%= distdir %>/css/app.*.css']
|
||||
};
|
||||
|
||||
gruntfile_cfg.useminPrepare = {
|
||||
dev: {
|
||||
src: '<%= src.html %>',
|
||||
options: {
|
||||
root: '<%= distdir %>',
|
||||
flow: {
|
||||
steps: {
|
||||
js: ['concat'],
|
||||
css: ['concat']
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
release: {
|
||||
src: '<%= src.html %>',
|
||||
options: {
|
||||
root: '<%= distdir %>',
|
||||
dest: '<%= distdir %>'
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
gruntfile_cfg.copy = {
|
||||
bundle: {
|
||||
files: [
|
||||
{ dest: '<%= distdir %>/js/', src: ['app.js'], expand: true, cwd: '.tmp/concat/js/' },
|
||||
{ dest: '<%= distdir %>/css/', src: ['app.css'], expand: true, cwd: '.tmp/concat/css/' }
|
||||
]
|
||||
},
|
||||
assets: {
|
||||
files: [
|
||||
{ dest: '<%= distdir %>/fonts/', src: '*.{ttf,woff,woff2,eof,svg}', expand: true, cwd: 'node_modules/bootstrap/fonts/' },
|
||||
{ dest: '<%= distdir %>/fonts/', src: '*.{ttf,woff,woff2,eof,eot,svg}', expand: true, cwd: 'node_modules/@fortawesome/fontawesome-free-webfonts/webfonts/' },
|
||||
{ dest: '<%= distdir %>/fonts/', src: '*.{ttf,woff,woff2,eof,svg}', expand: true, cwd: 'node_modules/rdash-ui/dist/fonts/' },
|
||||
{ dest: '<%= distdir %>/images/', src: '**', expand: true, cwd: 'assets/images/' },
|
||||
{ dest: '<%= distdir %>/ico', src: '**', expand: true, cwd: 'assets/ico' },
|
||||
{ dest: '<%= root %>/', src: 'templates.json', cwd: '' }
|
||||
]
|
||||
}
|
||||
tmp: [
|
||||
'<%= distdir %>/js/*',
|
||||
'!<%= distdir %>/js/app.*.js',
|
||||
'<%= distdir %>/css/*',
|
||||
'!<%= distdir %>/css/app.*.css'
|
||||
]
|
||||
};
|
||||
|
||||
gruntfile_cfg.eslint = {
|
||||
|
@ -178,86 +141,14 @@ gruntfile_cfg.eslint = {
|
|||
options: { configFile: '.eslintrc.yml' }
|
||||
};
|
||||
|
||||
gruntfile_cfg.html2js = {
|
||||
app: {
|
||||
options: { base: '.' },
|
||||
src: ['<%= src.tpl %>'],
|
||||
dest: '<%= distdir %>/templates/app.js',
|
||||
module: '<%= pkg.name %>.templates'
|
||||
}
|
||||
};
|
||||
|
||||
gruntfile_cfg.concat = {
|
||||
vendor: {
|
||||
files: {
|
||||
'<%= distdir %>/css/<%= pkg.name %>.css': ['<%= src.cssVendor %>', '<%= src.css %>'],
|
||||
'<%= distdir %>/js/vendor.js': ['<%= src.jsVendor %>'],
|
||||
'<%= distdir %>/js/angular.js': ['<%= src.angularVendor %>']
|
||||
}
|
||||
},
|
||||
dist: {
|
||||
options: { process: true },
|
||||
files: {
|
||||
'<%= distdir %>/js/<%= pkg.name %>.js': ['<%= src.js %>', '<%= src.jsTpl %>'],
|
||||
'<%= distdir %>/index.html': ['index.html']
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
gruntfile_cfg.uglify = {
|
||||
dist: {
|
||||
files: { '<%= distdir %>/js/<%= pkg.name %>.js': ['<%= src.js %>', '<%= src.jsTpl %>'] }
|
||||
},
|
||||
vendor: {
|
||||
options: { preserveComments: 'some' }, // Preserve license comments
|
||||
files: {
|
||||
'<%= distdir %>/js/vendor.js': ['<%= src.jsVendor %>'],
|
||||
'<%= distdir %>/js/angular.js': ['<%= src.angularVendor %>']
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
gruntfile_cfg.postcss = {
|
||||
build: {
|
||||
options: {
|
||||
processors: [
|
||||
autoprefixer({ browsers: 'last 2 versions' }), // add vendor prefixes
|
||||
cssnano() // minify the result
|
||||
]
|
||||
},
|
||||
src: '.tmp/concat/css/app.css',
|
||||
dest: '<%= distdir %>/css/app.css'
|
||||
}
|
||||
};
|
||||
|
||||
gruntfile_cfg.watch = {
|
||||
build: {
|
||||
files: ['<%= src.js %>', '<%= src.css %>', '<%= src.tpl %>', '<%= src.html %>'],
|
||||
tasks: ['build']
|
||||
}
|
||||
};
|
||||
|
||||
gruntfile_cfg.replace = {
|
||||
concat: {
|
||||
options: {
|
||||
patterns: [
|
||||
{ match: 'ENVIRONMENT', replacement: '<%= grunt.config.get("environment") %>' },
|
||||
{ match: 'CONFIG_GA_ID', replacement: '<%= pkg.config.GA_ID %>' },
|
||||
{ match: /..\/webfonts\//g, replacement: '../fonts/' }
|
||||
]
|
||||
},
|
||||
gruntfile_cfg.copy = {
|
||||
templates: {
|
||||
files: [
|
||||
{
|
||||
expand: true,
|
||||
flatten: true,
|
||||
src: ['.tmp/concat/js/app.js'],
|
||||
dest: '.tmp/concat/js'
|
||||
},
|
||||
{
|
||||
expand: true,
|
||||
flatten: true,
|
||||
src: ['.tmp/concat/css/app.css'],
|
||||
dest: '.tmp/concat/css'
|
||||
dest: '<%= root %>/',
|
||||
src: 'templates.json',
|
||||
cwd: ''
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue