Include only modules from Angular Material I need

I am using the $ mdDialog module from Angular Material, but I do not need a complete library. Is it possible to include only the modules that I need in the project, and how can I do this? I installed Angular Material with Bower and used Gulp in my project.

+4
source share
3 answers

Soon, Angular Material will turn into v1.1.0as a major release.

As a complement, a repository will be announced material-tools.

The Material Tools tool allows developers to create a custom Angular Material construct with the most essential components.

, .

, -.

https://github.com/angular/material-tools

+3

, $mdDialog angular -material.js, angular.js, angular -aria.js angular -animate.js. , .

Angular , - Polymer, Angular . , .

Polymer , , paper-dialog - demo

docs

enter image description here

+1

, , angularjs angular git

  • angular repo.
  • "npm install" "npm update"

js build

"\ gulp" util.js, buildJs()

    function buildJs () {
     // original code commented
     //var jsFiles = config.jsBaseFiles.concat([path.join(config.paths, '*.js')]);  

      var jsFiles = config.jsBaseFiles;

      //adding the paths of components you want
      jsFiles.push('src/components/icon/**/*.js');
      jsFiles.push('src/components/showHide/**/*.js');
      jsFiles.push('src/components/virtualRepeat/**/*.js');
      jsFiles.push('src/components/dialog/**/*.js');
  • "gulp build" js "\ dist"

angularjs webpack, "angular -material.js" "\ node_modules\angular -" , - .

css

"build-scss.js" "\ gulp\tasks" . getPaths()

function getPaths () {
    var paths = config.scssBaseFiles.slice();
    if ( modules ) {
      paths.push.apply(paths, modules.split(',').map(function (module) {
        return 'src/components/' + module + '/*.scss';
      }));
    } else {
     // original code commented
     // paths.push('src/components/**/*.scss');
      paths.push('src/core/services/layout/**/*.scss');

       //add the paths of components you want     
        paths.push('src/components/icon/**/*.scss');
        paths.push('src/components/showHide/**/*.scss');
        paths.push('src/components/virtualRepeat/**/*.scss');
        paths.push('src/components/datepicker/**/*.scss');
        paths.push('src/components/autocomplete/**/*.scss');
        paths.push('src/components/backdrop/**/*.scss');
        paths.push('src/components/dialog/**/*.scss');
  • "gulp build" css \dist

, , , , angular gulp .

angularjs npm, js css "\ node_modules\angular -material\modules\js", .

0

Source: https://habr.com/ru/post/1650277/


All Articles