Yesod: Weird error working with Lucius

Question

Hi I'm very new to yesod and I'm trying to follow this Tutorial but when I tried to develop the app it gives me this error:

Building ministeam-0.0.0...

Handler/AuthTut.hs:81:0: error: invalid preprocessing directive #message

cabal-dev: user error (Warning: cannot determine version of /home/nock/.cabal/bin/fake-ghc-cabal-dev : "== GHC Arguments: Start ==\n--numeric-version\n== GHC Arguments: End ==\n" /usr/bin/ar: dist/build/Handler/AuthTut.o: No such file or directory ) yesod: readProcess: cabal-dev "buildopts" (exit 1): failed

It seems this part of the code isn't right (see below). Actually I don't understand how is he using that "toWidget" function in that part of the code. I thought there was missing the import of the Lucius module and I added it to the list of imports the tutorial had, but the error persists.

defaultLayout inside = do
    mmsg <- getMessage
    pc <- widgetToPageContent $ do
                toWidget [lucius|
body {
    width: 760px;
    margin: 1em auto;
    font-family: sans-serif;
}
#message{
    color: #900;
}
|]      

            inside

hamletToRepHtml [hamlet|
$doctype 5
<html>
    <head>
        <title>#{pageTitle pc}
        ^{pageHead pc}
    <body>
        $maybe msg <- mmsg
            <div #message>#{msg}
        ^{pageBody pc}
|]

Thanks in advance for your attention!

Michael Snoyman Michael Snoyman · Accepted Answer · 2012-07-16T04:49:09

I'm guessing you have the CPP (C pre-processor) language extension enabled. In that case, any line in your Haskell files which starts with a hash will be interpreted as a CPP diretive. And since #message is an invalid directive, you get an error message.

I would recommend switching to an external Lucius template and using widgetFile. This will have the additional advantage of being able to get automatic CSS regeneration during development.

Yesod: Weird error working with Lucius

2 Answers