axdemelas

1. Instale as dependências:

yarn add webpack babel-core babel-loader babel-preset-env

2. Crie o arquivo de configuração do webpack:

touch webpack.config.js

axdemelas

<!-- Material Design Lite files above. -->
<link rel="stylesheet" href="./node_modules/mdl-stepper/stepper.min.css">
<script defer src="./node_modules/mdl-stepper.min.js"></script>

axdemelas

npm install --save mdl-stepper

axdemelas

# First, make sure that you have SASS installed (http://sass-lang.com/install).
sass --version
# $ Sass x.x.x
# Inside mdl-stepper/ folder.
cd src
# ~/mdl-stepper/src
# Build a development version of css changes.
sass mdl-stepper.scss:../stepper.css
# Build a production version of css changes.
sass mdl-stepper.scss:../stepper.min.css --style compressed

axdemelas

# Inside mdl-stepper/ folder.
# Install dev dependencies.
npm install
# Build a development version of javascript changes.
npm run dev
# Build a production version of javascript changes.
npm run prod
# Build a production version of javascript changes on WINDOWS.
# npm run prod-windows

axdemelas

# Clone the Stepper source code.
git clone git@github.com:axdemelas/mdl-stepper.git
# Go to created folder.
cd mdl-stepper

axdemelas

<!-- style -->
<style>
.mdl-stepper > .mdl-step > .mdl-step__content:not(#demo-error-state-content) {
  background-color: rgba(0,0,0,0.2);
}
</style>

<!-- markup -->
<ul class="mdl-stepper mdl-stepper--linear" id="demo-error-state">
  <li class="mdl-step">

axdemelas

<!-- style -->
<style>
.mdl-stepper > .mdl-step > .mdl-step__content {
  background-color: rgba(0,0,0,0.2);
}
</style>

<!-- markup -->
<ul class="mdl-stepper mdl-stepper--linear" id="demo-optional-steps">
  <li class="mdl-step">

axdemelas

<!-- style -->
<style>
.mdl-stepper > .mdl-step > .mdl-step__content {
  background-color: rgba(0,0,0,0.2);
}
</style>

<!-- markup -->
<ul class="mdl-stepper mdl-stepper--linear" id="demo-editable-steps">
  <li class="mdl-step mdl-step--editable">

axdemelas

<!-- style -->
<style>
.mdl-stepper > .mdl-step > .mdl-step__content {
  background-color: rgba(0,0,0,0.2);
}
</style>

<!-- markup -->
<ul class="mdl-stepper mdl-stepper--feedback mdl-stepper--linear" id="demo-stepper-feedback">
  <li class="mdl-step">