How can I convert the following line to haml:
<link rel="shortcut icon" href="<%= asset_path "favicon.ico" %>" />
I tried using the following but it throws an error in rails:
%link{href: asset_path "favicon.ico", rel: "shortcut icon"}/
You need to use asset_path(...) not asset_path ...:
%link{href: asset_path("favicon.ico"), rel: "shortcut icon"}/
The issue is with the Ruby this compiles to. Your HAML is producing something like this pseudo code:
tag("link", href: asset_path "favicon.ico", rel: "shortcut icon")
This is syntactically ambiguous; Ruby can't know which of the following you intended:
tag(href: asset_path("favicon.ico"), rel: "...")
tag(href: asset_path("favicon.ico", rel: "..."))
So Ruby chooses to raise a syntax error in this case, forcing you to write unambiguous code.
Related
I’m trying to integrate Netlify CMS to a static Pelican website.
I can’t seem to access /admin as I get the following error:
Error: Failed to load config.yml
Check your config.yml file.
Here is the content of admin/index.html (I followed these instructions)
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Content Manager</title>
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
</head>
<body>
<!-- Include the script that builds the page and powers Netlify CMS -->
<script src="https://unpkg.com/netlify-cms#^2.0.0/dist/netlify-cms.js"></script>
</body>
</html>
and here is the content of my config.yaml
backend:
name: github-getaway
branch: master
media_folder: "img/uploads" # Folder where user uploaded files should go
public_folder: "uploads"
collections: # A list of collections the CMS should be able to edit
- name: "post" # Used in routes, ie.: /admin/collections/:slug/edit
label: "Article" # Used in the UI, ie.: "New Post"
folder: "content/news" # The path to the folder where the documents are stored
format: markdown
sort: "date:desc" # Default is title:asc
create: true # Allow users to create new documents in this collection
fields: # The fields each document in this collection have
- {label: "Title", name: "title", widget: "string", tagname: "h2", class: "entry-title"}
- {label: "Body", name: "body", widget: "markdown"}
meta: # Meta data fields. Just like fields, but without any preview element
- {label: "Publish Date", name: "date", widget: "datetime"}
- {label: "Category", name: "category", widget: "string", default: "News"}
if needed, the website’s url is https://distracted-engelbart-20e42f.netlify.com
Any ideas on what I’m doing wrong here?
This post is a few months old so I guess you got this working?
I had to add the admin files to the STATIC_PATHS variable in pelicanconf.py
STATIC_PATHS = [
'admin/index.html',
'admin/config.yml',
'images',
'extra'
]
Here's my example repo with Netlify CMS integrated https://github.com/marcus-clements/pelican-netlify-cms
I am facing some issue loading 3rd party script and stylesheets in Vuepress. It's not showing error after adding it to head section of the front matter but I'm not able to access any of the UIkit class or make http calls. Newbie to Vue and Vuepress. Am I missing something?
head: [
['link', { rel: 'stylesheet', href: `https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-rc.10/css/uikit.min.css` }],
['script',{ src: 'https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-rc.10/js/uikit.min.js' }],
['script',{ src: 'https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-rc.10/js/uikit-icons.min.js' }],
['script',{ src: 'https://cdn.jsdelivr.net/npm/vue-resource#1.5.1' }]
],
You just have to re-run the build command:
npm run docs:dev
One of my javascript files is using the lodash template syntax:
const deliveryClient = new DeliveryClient({
enablePreviewMode: <%= options.enablePreviewMode %>,
projectId: '<%= options.projectId %>',
previewApiKey: '<%= options.previewApiKey %>',
defaultLanguage: '<%= options.defaultLanguage %>',
enableAdvancedLogging: <%= options.enableAdvancedLogging %>,
baseUrl: '<%= options.baseUrl %>',
typeResolvers: typeResolvers
});
But when i run rollup -c i'm getting a "unexpected token" error. Is there a way to tell rollup to ignore (just put it in the output file) some lines of code?
Or is there an other/better way to deal with lodash template syntax within RollupJS?
I just want to above code snippet to be in my final output!
I fixed it by using the rollup-plugin-replace plugin.
In my javascript I changed my code into the following:
const deliveryClient = new DeliveryClient('KENTICOOPTIONS');
and in the rollup.config.js I added the plugin with the following configuration:
replace({
include: 'lib/templates/plugin.template.js',
KENTICOOPTIONS: '<%= serialize(options) %>'
})
So this gives the final output of:
const deliveryClient = new DeliveryClient('<%= serialize(options) %>');
Which is exactly what i needed!
I'm starting a fresh web project and the last part of my configuration is to enable debugging for my CoffeeScripts files.
The whole project is build using a Grunt task that compile coffee to js and generates the proper map file but I cannot make the Coffeescript debuging work in IntelliJ.
Note that I don't want to use IntelliJ File Watchers.
Here is my Gruntfile :
module.exports = (grunt) ->
grunt.initConfig
pkg: grunt.file.readJSON('package.json')
coffee:
options:
sourceMap: true
files:
expand: true
flatten: true
cwd: 'src/'
src: ['**/*.coffee']
dest: 'src/'
ext: '.js'
concat:
option:
separator: ';'
dist:
src: ['src/**/*.js']
dest: 'dist/<%= pkg.name%>.js'
uglify:
options:
banner: '/*! <%= pkg.name %> v<%= pkg.version%> by Pierre Degand <%= grunt.template.today("dd-mm-yyyy") %> */\n'
dist:
files:
'lib/<%= pkg.name%>.min.js': ['<%= concat.dist.dest %>']
watch:
files: ['<%= coffee.files.src %>']
tasks: ['coffee', 'concat', 'uglify']
grunt.loadNpmTasks('grunt-contrib-concat')
grunt.loadNpmTasks('grunt-contrib-uglify')
grunt.loadNpmTasks('grunt-contrib-coffee')
grunt.loadNpmTasks('grunt-contrib-watch')
grunt.registerTask('default', ['coffee', 'concat', 'uglify'])
My Simple CoffeeScript file (Break point is on line 2 on IntelliJ) :
name = 'Pierre'
console.log "Hello #{name} !"
Generated JS file from Grunt :
(function() {
var name;
name = 'Pierre';
console.log("Hello " + name + " !!");
}).call(this);
/*
//# sourceMappingURL=app.js.map
*/
The source map
{
"version": 3,
"file": "app.js",
"sourceRoot": "",
"sources": [
"app.coffee"
],
"names": [],
"mappings": "AAAA;CAAA,GAAA,EAAA;;CAAA,CAAA,CAAO,CAAP,IAAA;;CAAA,CACA,CAAA,CAAa,CAAb,EAAO,CAAM;CADb"
}
And finally the html I use to test
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src="src/app.js"></script>
</body>
</html>
When I used File watchers, the .js and the .map.js were subfiles of the .coffee file, can I achieve the same behavior without using File Watchers ?
If I right-click/"Debug index.html" in IntelliJ, I can read "Hello Pierre!!" in my IntelliJ debuger console, but the script is not breaked on the console.log()
Did someone had same troubles ?
Thanks!
When I used File watchers, the .js and the .map.js were subfiles of the .coffee file, can I achieve the same behavior without using File Watchers?
No, you can't. This is a file watchers feature
If I right-click/"Debug index.html" in IntelliJ, I can read "Hello Pierre!!" in my IntelliJ debuger console, but the script is not breaked on the console.log()
This works for me if I refresh a page in browser after the code was executed. Please vote for this ticket
this was my first dojo build so please excuse my ignorance in this matter.
I've just created my custom build from dojo build system using the following (very simplified) profile:
dependencies = {
stripConsole: "normal",
layers: [
{
name: "../dijits/cx/dijitsCXbuild.js",
copyrightFile: "CopyrightCX.txt",
dependencies: [
"dojo.parser",
"dijit.dijit",
"dijit._Widget",
"dijit._Templated",
"dijit._Container",
"dojo.i18n",
"dojo.NodeList-fx",
"dojox.grid.cells",
"dojox.grid.DataGrid",
"dojox.layout.GridContainer",
"dijit.TitlePane",
"dijits.cx.TaskPanel",
"dijits.cx.Identify"
]
}
],
prefixes: [
[ "dijit", "../dijit" ],
[ "dojox", "../dojox" ],
[ "dijits.cx", "../dijits/cx" ]
]
}
... well, it all proceeds fine and I get my own package with everything I requested. Then in my webapp I include the following
<script type="text/javascript">
djConfig = {
isDebug:false,
parseOnLoad:true,
locale:getLocale()
};
</script>
<script type="text/javascript" src="Lib/cxdojo/dojo/dojo.js"></script>
<script type="text/javascript" src="Lib/cxdojo/dijits/cx/dijitsCXbuild.js"></script>
... looks ok, until the code needs to instantiate the first dijit and it fails with the notorious : "dijits.cx. TaskPanel is not a constructor."
I can get rid of this problem by including the "dojo.require()" but that's something I though I'll get rid of by creating my custom own build. Any ideas of what am I doing wrong or what shall I do in order to avoid that 'dojo.require()' lines...
thanks heaps.
You still need the dojo.require in your file. The compressed build just prevents the dojo.require from doing a GET request for the file that is required by concatenating all the files into one file and shrinking it. This saves cycles on page load quite a bit (as I'm sure you have seen by now).
If you really want to get rid of the many dojo.require (which I'm not too crazy about because I like seeing what's used in the page), you can do something like this:
dojo.provide('my.main');
dojo.require('dijit.cx.TaskPane');
... all the other dojo.require statements ...
Then put this in a file in a directory parallel to dojo:
Lib/cxdojo/my/main.js
Lib/cxdojo/dojo/dojo.js
.. etc ...
Then change your dependencies to be:
dependencies: [
"my.main"
]
Then in your file, you can include it with the script tag:
<script type="text/javascript" src="Lib/cxdojo/my/main.js"></script>
Then, you only need one require:
dojo.require('my.main');
Another advantage of this approach is that you only need to change one file (the /my/main.js) when you add a module to your application.