将面对角度的错误从角度7升级到角度8时遇到CSS,SCSS错误

时间:2019-12-23 11:51:08

标签: css sass angular8

我想将7号角更新为8号角 当在终端中服务应用程序面临问题时

Module build failed (from ./node_modules/sass-loader/lib/loader.js):

    @include transition(opacity .2s);
         ^
      Mixin transition is missing argument $type.
      in /home/webelight-pc/www/thunder-school/src/assets/sass/scss/core/_horizontal-timeline.scss (line 12, column 11)
ERROR in multi ./node_modules/ngx-toastr/toastr.css ./src/assets/css/prism.min.css ./node_modules/sweetalert2/dist/sweetalert2.min.css ./node_modules/ngx-ui-switch/ui-switch.component.css ./src/assets/css/wizard.css ./src/assets/css/quill.snow.css ./src/assets/css/quill.bubble.css ./src/assets/css/hopscotch.css ./node_modules/nouislider/distribute/nouislider.min.css ./node_modules/angular-calendar/scss/angular-calendar.scss ./node_modules/dragula/dist/dragula.css ./node_modules/@swimlane/ngx-datatable/release/index.css ./node_modules/@swimlane/ngx-datatable/release/assets/icons.css ./node_modules/@swimlane/ngx-datatable/release/themes/material.css ./node_modules/angular2-multiselect-dropdown/themes/default.theme.css ./src/assets/css/demo.css ./src/assets/sass/app.scss ./node_modules/intl-tel-input/build/css/intlTelInput.css ./src/styles.css
Module not found: Error: Can't resolve '/home/webelight-pc/www/thunder-school/node_modules/@swimlane/ngx-datatable/release/assets/icons.css' in '/home/webelight-pc/www/thunder-school'
ERROR in multi ./node_modules/ngx-toastr/toastr.css ./src/assets/css/prism.min.css ./node_modules/sweetalert2/dist/sweetalert2.min.css ./node_modules/ngx-ui-switch/ui-switch.component.css ./src/assets/css/wizard.css ./src/assets/css/quill.snow.css ./src/assets/css/quill.bubble.css ./src/assets/css/hopscotch.css ./node_modules/nouislider/distribute/nouislider.min.css ./node_modules/angular-calendar/scss/angular-calendar.scss ./node_modules/dragula/dist/dragula.css ./node_modules/@swimlane/ngx-datatable/release/index.css ./node_modules/@swimlane/ngx-datatable/release/assets/icons.css ./node_modules/@swimlane/ngx-datatable/release/themes/material.css ./node_modules/angular2-multiselect-dropdown/themes/default.theme.css ./src/assets/css/demo.css ./src/assets/sass/app.scss ./node_modules/intl-tel-input/build/css/intlTelInput.css ./src/styles.css
Module not found: Error: Can't resolve '/home/webelight-pc/www/thunder-school/node_modules/@swimlane/ngx-datatable/release/index.css' in '/home/webelight-pc/www/thunder-school'
ERROR in multi ./node_modules/ngx-toastr/toastr.css ./src/assets/css/prism.min.css ./node_modules/sweetalert2/dist/sweetalert2.min.css ./node_modules/ngx-ui-switch/ui-switch.component.css ./src/assets/css/wizard.css ./src/assets/css/quill.snow.css ./src/assets/css/quill.bubble.css ./src/assets/css/hopscotch.css ./node_modules/nouislider/distribute/nouislider.min.css ./node_modules/angular-calendar/scss/angular-calendar.scss ./node_modules/dragula/dist/dragula.css ./node_modules/@swimlane/ngx-datatable/release/index.css ./node_modules/@swimlane/ngx-datatable/release/assets/icons.css ./node_modules/@swimlane/ngx-datatable/release/themes/material.css ./node_modules/angular2-multiselect-dropdown/themes/default.theme.css ./src/assets/css/demo.css ./src/assets/sass/app.scss ./node_modules/intl-tel-input/build/css/intlTelInput.css ./src/styles.css
Module not found: Error: Can't resolve '/home/webelight-pc/www/thunder-school/node_modules/@swimlane/ngx-datatable/release/themes/material.css' in '/home/webelight-pc/www/thunder-school'
ERROR in ./node_modules/ngx-quill/fesm2015/ngx-quill.js
Module not found: Error: Can't resolve 'quill' in '/home/webelight-pc/www/thunder-school/node_modules/ngx-quill/fesm2015'

2 个答案:

答案 0 :(得分:0)

过渡函数具有两个参数

@include transition(cssProperty,animationDuration transitionFunction);

过渡功能不是必需的,默认情况下很容易

在您的情况下,可能类似于

@include transition(opacity, 2s);

@include transition(opacity, 2s ease-in);

转换功能的完整列表为:

  • 轻松
  • 线性
  • 缓入
  • 退出
  • 由内而外
  • 开始
  • 步骤结束
  • steps(int,start | end)
  • cubic-bezier(n,n,n,n)

可以找到更多示例:https://www.w3schools.com/cssref/css3_pr_transition.asp

答案 1 :(得分:0)

@include过渡(不透明度,0.2秒缓解);