私はapostrophe-assets
モジュールを使用して、cssとjsファイルを@boutellと同じ方法でプッシュしました。 js
ファイルをプッシュするにはOKですが、css
の場合は、ブートストラップCSSに関連する解析エラーが発生しました。だから、アポストロフィはすでにCSSであるのに対し、アポストロフィはそれをCSSにコンパイルしようとするからです。
outerLayot.html
Nunjucksテンプレートを上書きしました。だから、基本的にファイル node_modules/lib/modules/apostrohpe-templates/views/outerLayout.html
で、我々は持っている:
自体が、私は
{% block extraHead %}{% endblock %}
ブロックを使用して新しいファイルにそれをオーバーライドしている。ここ
outerLayoutBase.html
node_modules/lib/modules/apostrohpe-templates/views/outerLayoutBase.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>{% block title %}{% endblock %}</title>
{{ apos.assets.stylesheets(data.when) }}
{% block standardHead %}
<meta name="viewport" content="width=device-width, initial-scale=1">
{% endblock %}
{% block extraHead %}
{% endblock %}
</head>
<body class="{% block bodyClass %}{% endblock %}">
{% block apostropheMenu %}
{{ apos.adminBar.output() }}
{% endblock %}
{% if data.user %}
<div class="apos-ui">
<div class="apos-context-menu-container">
{{ apos.pages.publishMenu({ publishMenu: data.publishMenu, page: data.page, piece: data.piece, bottom: true }) }}
{{ apos.pages.menu({ contextMenu: data.contextMenu, page: data.page, bottom: true })}}
</div>
</div>
{% endif %}
<div class="apos-refreshable" data-apos-refreshable>
{% block beforeMain %}{% endblock %}
<a name="main"></a>
{% block main %}{% endblock %}
{% block afterMain %}{% endblock %}
</div>
{{ apos.assets.templates(data.when) }}
{{ apos.assets.scripts(data.when) }}
<script type="text/javascript">
{{ data.js.globalCalls }}
{{ data.js.reqCalls }}
</script>
{% block extraBody %}
{% endblock %}
</body>
</html>
を拡張
{% extends "outerLayoutBase.html" %}
を: /lib/modules/apostrohpe-templates/views/outerLayout.html
{% extends "outerLayoutBase.html" %}
{% block extraHead %}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
{% endblock %}
上記のファイルには、ブートストラップCSSのCDNが含まれており、期待どおりに動作します。 この新しいファイルのパスに注意してください。 lib
フォルダは、node_modules
ではなくルートフォルダの下にあります。
これを試してみます。クイックメモ、[this](http://apostrophecms.org/docs/tutorials/getting-started/pushing-assets.html)の記事に誤字があるようです。アセットモジュールにスクリプトを追加すると、lib/modules/apostrophe-assets/public/js/siteの代わりに 'lib/modules/apostrophe-assets/public/css/site.js'が検索されます。 js'とそのコードスニペットのコメントはlessとcssを参照してください。 – Carson
私はこれを基本的な 'bootstrap.css'で試しました。私はブートストラップファイルを自分のサイトに含めるには' bootstrap.less'という名前を付けなければなりませんでした。私が何をしたとしても、 'bootstrap.min.css'や' bootstrap.min.less'はインクルードできませんでした。私はminファイルを使用しようとすると解析エラーが出ます。 – Carson
別の質問ですが、 'apostrophe-assets'モジュールにイメージファイルを含めることはできますか? – Carson