ejs の代わりに jade を使用するようにアプリをリファクタリングしようとしていますが、ログイン フォームの設定で問題が発生しています。
ejs での元のフォームは次のとおりです。
<% if (message) { %>
<p><%= message %></p>
<% } %>
<form class="form-horizontal" action='/login' method="POST" id="loginForm">
<fieldset>
<div id="legend">
<legend class="">Login</legend>
</div>
<div class="control-group">
<!-- Username -->
<label class="control-label" for="username">Username</label>
<div class="controls">
<input type="text" id="username" name="username" placeholder="" class="input-xlarge">
</div>
</div>
<div class="control-group">
<!-- Password-->
<label class="control-label" for="password">Password</label>
<div class="controls">
<input type="password" id="password" name="password" placeholder="" class="input-xlarge">
</div>
</div>
<div class="control-group">
<!-- session-->
<label class="control-label" for="rememberme">Remember Me</label>
<div class="controls">
<input type="checkbox" name="rememberme"/>
</div>
</div>
<div class="control-group">
<!-- Button -->
<div class="controls">
<button class="btn btn-success">Login</button>
</div>
</div>
</fieldset>
</form>
そして、ここにジェイドの私の新しいフォームがあります:
extends layout
block content
if message
p= message
form(class='form-horizontal',action='/login',method='POST',id='loginForm')
fieldset
div#legand
legend Login
div.control-group
label(for='username',class='control-label') Username
div.controls
input(type='text',id='username',name='username',placeholder='Username',class='input-xlarge')
div.control-group
label(for='password',class='control-label') Password
div.controls
input(type='text',id='password',name='password',placeholder='Password',class='input-xlarge')
div.control-group
label(for='rememberme',class='control-label') Remember Me
div.controls
input(type='checkbox',name='rememberme')
div.control-group
div.controls
input(type='submit',class='btn btn-success') Login
Codekit がエラーをスローしています:
/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/runtime.js:173
throw err;
^
Error: /Users/sm/Documents/Projects/Web_Applications/App/app/views/login.jade:27
25|
26|
> 27|
Invalid indentation, you can use tabs or spaces but not both
at Object.Lexer.indent (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:672:15)
at Object.Lexer.next (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:770:15)
at Object.Lexer.blank (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:179:19)
at Object.Lexer.next (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:744:15)
at Object.Lexer.blank (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:179:19)
at Object.Lexer.next (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:744:15)
at Object.Lexer.lookahead (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/lexer.js:106:46)
at Object.Parser.lookahead (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/parser.js:115:23)
at Object.Parser.peek (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/parser.js:92:17)
at Object.Parser.tag (/Applications/CodeKit.app/Contents/Resources/engines/jade/lib/parser.js:666:30)
このインデント エラーを回避して、このフォームを機能させるにはどうすればよいですか? タブのみを使用し、スペースを使用していないため、何が問題なのかわかりません。