Spike

Spike

A modern static build tool, powered by webpack

Get Started    Support
Ask A Question

Questions

0

Configuring Spike with Tailwind

We need tailwind to work on a current project, but as I know tailwind needs to be pushed at the start of the postcss plugins. ``` const htmlStandards = require('reshape-standard'); const cssStandards = require('spike-css-standards'); const jsStandards = require('spike-js-standards'); const env = process.env.SPIKE_ENV; const Records = require('spike-records'); const MarkdownIt = require('markdown-it'); const path = require('path'); const md = new MarkdownIt(); var tailwindcss = require('tailwindcss')('./tailwind.js'); const css = cssStandards( { minify: env === 'production', warnForDuplicates: env !== 'production' } ) css.plugins.push(tailwindcss); const locals = { md: md.render.bind(md), mediaUrl: 'https://media.graphcms.com' } const apiUrl = 'https://api-uswest.graphcms.com/v1/cjj6ximdp01bv01ggojsg4m64/master' module.exports = { devtool: 'source-map', ignore: ['**/layout.html', '**/_*', '**/.*', '*.md', 'yarn.lock', 'package-lock.json', 'Jenkinsfile'], reshape: htmlStandards({ root: path.join(__dirname, 'views'), locals: (ctx) => locals, minify: env === 'production' }), postcss: css, babel: jsStandards(), plugins: [ new Records({ addDataTo: locals, three: { data: { foo: 'bar' } }, projects: { graphql: { url: apiUrl, query: `{ projects { id, name, description } }` }, transform: (res) => res.data.projects } }) ] } ``` We currently have this setup, with the Tailwind loaded and pushed to the css standards stack. But Tailwind keeps on spitting out an error. It would be nice for a static site generator to atleast support Tailwind CSS! Thanks

Posted by Michael Thomas 16 days ago

1

Error

I keep getting this error: ✗ ERROR { ModuleBuildError: Module build failed: SyntaxError: Expecting Unicode escape sequence \uXXXX (1:691) at Parser.pp$4.raise (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2488:13) at Parser.pp$7.readWord1 (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:3319:16) at Parser.pp$7.readWord (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:3338:19) at Parser.pp$7.readToken (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2731:17) at Parser.pp$7.nextToken (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2724:13) at Parser.pp$7.next (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2684:8) at Parser.pp$3.parseExprOp (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1808:12) at Parser.pp$3.parseExprOps (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1793:15) at Parser.pp$3.parseMaybeConditional (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1774:19) at Parser.pp$3.parseMaybeAssign (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1750:19) at runLoaders (/Users/nathaliesicard/workspace/coinsayer/node_modules/webpack/lib/NormalModule.js:195:19) at /Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:364:11 at /Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:230:18 at context.callback (/Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:111:13) at tryCatchReject (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:845:30) at runContinuation1 (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:804:4) at Rejected.when (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:625:4) at Pending.run (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:483:13) at Scheduler._drain (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/Scheduler.js:62:19) at Scheduler.drain (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/Scheduler.js:27:9) id: 'a1b80172' } ✗ ERROR { ModuleBuildError: Module build failed: SyntaxError: Expecting Unicode escape sequence \uXXXX (1:691) at Parser.pp$4.raise (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2488:13) at Parser.pp$7.readWord1 (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:3319:16) at Parser.pp$7.readWord (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:3338:19) at Parser.pp$7.readToken (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2731:17) at Parser.pp$7.nextToken (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2724:13) at Parser.pp$7.next (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2684:8) at Parser.pp$3.parseExprOp (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1808:12) at Parser.pp$3.parseExprOps (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1793:15) at Parser.pp$3.parseMaybeConditional (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1774:19) at Parser.pp$3.parseMaybeAssign (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1750:19) at runLoaders (/Users/nathaliesicard/workspace/coinsayer/node_modules/webpack/lib/NormalModule.js:195:19) at /Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:364:11 at /Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:230:18 at context.callback (/Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:111:13) at tryCatchReject (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:845:30) at runContinuation1 (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:804:4) at Rejected.when (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:625:4) at Pending.run (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:483:13) at Scheduler._drain (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/Scheduler.js:62:19) at Scheduler.drain (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/Scheduler.js:27:9) id: 'a1b80172' } ⚠ WARNING { ModuleBuildError: Module build failed: SyntaxError: Expecting Unicode escape sequence \uXXXX (1:691) at Parser.pp$4.raise (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2488:13) at Parser.pp$7.readWord1 (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:3319:16) at Parser.pp$7.readWord (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:3338:19) at Parser.pp$7.readToken (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2731:17) at Parser.pp$7.nextToken (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2724:13) at Parser.pp$7.next (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:2684:8) at Parser.pp$3.parseExprOp (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1808:12) at Parser.pp$3.parseExprOps (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1793:15) at Parser.pp$3.parseMaybeConditional (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1774:19) at Parser.pp$3.parseMaybeAssign (/Users/nathaliesicard/workspace/coinsayer/node_modules/acorn-globals/node_modules/acorn/dist/acorn.js:1750:19) at runLoaders (/Users/nathaliesicard/workspace/coinsayer/node_modules/webpack/lib/NormalModule.js:195:19) at /Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:364:11 at /Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:230:18 at context.callback (/Users/nathaliesicard/workspace/coinsayer/node_modules/loader-runner/lib/LoaderRunner.js:111:13) at tryCatchReject (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:845:30) at runContinuation1 (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:804:4) at Rejected.when (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:625:4) at Pending.run (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/makePromise.js:483:13) at Scheduler._drain (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/Scheduler.js:62:19) at Scheduler.drain (/Users/nathaliesicard/workspace/coinsayer/node_modules/when/lib/Scheduler.js:27:9) id: 'a1b80172' } The project still gets built. This is what my app.js file looks like: const htmlStandards = require('reshape-standard') const cssStandards = require('spike-css-standards') const jsStandards = require('spike-js-standards') const pageId = require('spike-page-id') const env = process.env.SPIKE_ENV module.exports = { devtool: 'source-map', ignore: ['**/layout.html', '**/_*', '**/.*', 'readme.md', 'yarn.lock', 'package-lock.json'], matchers: { css: '*(**/)*.scss' }, module: { rules: [ { test: /\.scss/, use: [{ loader: 'sass-loader' }] } ] }, reshape: htmlStandards({ locals: (ctx) => { return { pageId: pageId(ctx), foo: 'bar' } }, minify: env === 'production' }), postcss: cssStandards({ minify: env === 'production', warnForDuplicates: env !== 'production' }), babel: jsStandards() } Any idea of what is going on?

Posted by Ana Black 5 months ago