Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

failed to reproduce #1

Open
gwijayas opened this issue Oct 21, 2016 · 1 comment
Open

failed to reproduce #1

gwijayas opened this issue Oct 21, 2016 · 1 comment

Comments

@gwijayas
Copy link

Trying reproduce, but only successfuly create amphtml/css/bootstrap.min.css. No amphtml/index.html and no build directory.

Using nodejs 0.12.7

@uncompiled
Copy link
Owner

The default gulp command doesn't run any of the helper tasks.

You need to run each of these tasks individually to create the output:

  • gulp purify to output the purified CSS in amphtml/css
  • gulp inline-css to insert the CSS into the HTML in build/index.html
  • gulp validate to run the AMP validator on the output file

That was done intentionally because this example workflow is really not a panacea to make Bootstrap 100% compatible with AMP. In this example, gulp validate is expected to fail. This is because even after cleaning Bootstrap's CSS, there are still CSS classes that are used, but not allowed as part of the AMP spec. Notably, the errors are caused by @-ms-viewport and !important present in the final CSS.

Possible solutions are:

  • Build a version of Bootstrap CSS from source that validates with the AMP validator.
  • Build a node module that automatically cleanses/fixes CSS that is not valid in the AMP spec. Stripped CSS would need to be output because this could cause unintended changes to the layout during the build process. This is another reason that I didn't automatically remove invalid CSS classes in this example.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants