小编Ree*_*rma的帖子

在 Gatsby 上运行 SASS 不起作用

昨天,我能够设置 gatsby 的入门包实例并部署到 github 页面。

从那以后,我在本地更新了我的 react/js 文件,这似乎在本地运行良好。现在我想编译我的 sass:

我找不到一个合适的解决方案:

这是我尝试安装的 sass 编译器: sass --watch assets/scss/main.scss:assets/css/style.css Node sass watch 运行,但实际上并没有编译任何东西。我收到一个错误:

问题:

1)自从安装了sass

./src/assets/scss/main.scss
Module parse failed: /Users/reenaverma/development/GATSBY/src/assets/scss/main.scss Unexpected character '#' (1:8)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected character '#' (1:8)
    at Parser.pp$4.raise (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:2221:15)
    at Parser.pp$7.getTokenFromCode (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:2756:10)
    at Parser.pp$7.readToken (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:2477:17)
    at Parser.pp$7.nextToken (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:2468:15)
    at Parser.pp$7.next (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:2413:10)
    at Parser.pp.eat (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:536:12)
    at Parser.pp$1.parseStatement (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:728:71)
    at Parser.pp$1.parseTopLevel (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:638:25)
    at Parser.parse (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:516:17)
    at Object.parse (/Users/reenaverma/development/GATSBY/node_modules/acorn/dist/acorn.js:3098:39)
    at Parser.parse (/Users/reenaverma/development/GATSBY/node_modules/webpack/lib/Parser.js:902:15) …
Run Code Online (Sandbox Code Playgroud)

deployment github sass gatsby

6
推荐指数
1
解决办法
3923
查看次数

ReactJS-无法读取未定义的属性“ preventDefault”

在ReactJS中尝试做一个简单的onClick事件/函数。

单击按钮后,我想运行一个名为“ onClick”的函数,但是在控制台中出现此错误:

app.js:62 Uncaught TypeError: Cannot read property 'preventDefault' of undefined
Run Code Online (Sandbox Code Playgroud)

用谷歌搜索,但不确定我要怎么做。我看过ReactJs文档,这看起来是正确的,但显然不正确。这是我的代码:

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter} from 'react-router-dom';
import axios from 'axios';

import Navbar from './components/Navbar';
import Header from './components/Header';
import GiphyButton from './components/GiphyButton';
import './assets/sass/main.scss';

class App extends React.Component {

  constructor() {
    super();

    this.state = {
      giphy: []
    };

    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(e) {
    e.preventDefault();

    console.log('giffy button clicked');
    axios.get('http://api.giphy.com/v1/gifs/search?q=otters&api_key=<API KEY>')

      .then(res => {
        this.setState({ giphy: res.data });
        console.log(res.data);
      });
  } …
Run Code Online (Sandbox Code Playgroud)

javascript function onclick preventdefault reactjs

6
推荐指数
1
解决办法
4831
查看次数

致命:pathspec'README.txt'与任何文件都不匹配

真的陷入了这个问题.我已经google了很多,无法弄清楚我做错了什么......

我正在尝试通过git add README.txt终端中的命令创建一个新文件...

(到目前为止,我已经创建了一个新文件夹Fundamentals.创建了一个子文件夹git-practice.并通过git init命令创建了一个git repo )

但是,当我尝试添加文件时fundamentals/git-practice,我收到以下错误..

fatal: pathspec 'README.txt' did not match any files
Run Code Online (Sandbox Code Playgroud)

不知道我做错了什么......一切似乎都有道理.这是代码:

Reenas-MBP:~ reenaverma$ cd ~

Reenas-MBP:~ reenaverma$ ls
72.png          GitHub          flask-workshop
Applications        Library         fundamentals
Creative Cloud Files    Movies          funny_things
Desktop         Music           get-pip.py
Documents       Pictures        world
Downloads       Public          wwlc
Dropbox         Retrieved Contents

Reenas-MBP:~ reenaverma$ cd fundamentals

Reenas-MBP:fundamentals reenaverma$ ls
git-practice

Reenas-MBP:fundamentals reenaverma$ cd git-practice

Reenas-MBP:git-practice reenaverma$ ls -a
.   ..  .git

Reenas-MBP:git-practice reenaverma$ pwd …
Run Code Online (Sandbox Code Playgroud)

git

5
推荐指数
3
解决办法
9126
查看次数

在GitHub Pages上设置Gatsby

我一直在恶心自己设置一个reactjs Web应用程序/ webpack等。所以现在我正在使用Gatsby,它可以挽救生命!!!!

我已经使用NPM在本地安装了盖茨比。我想将其部署到我的Github页面上。

这是我遵循的说明:https : //www.gatsbyjs.org/docs/deploy-gatsby/#github-pages

这是我在GitHub.io页面上看到的内容:https ://reenaverma.github.io/

它不是默认的入门包索引页面/内容,我在本地主机8000上看到了。

我可以在我的Github存储库上看到正确的内容已部署到Github:https : //github.com/ReenaVerma/reenaverma.github.io

但是我实际上没有在URL上看到它。好像它是我的自述文件的第一篇...如何解决此问题?

有任何想法吗?

javascript github github-pages gatsby

5
推荐指数
1
解决办法
877
查看次数

拆分数组中的元素并添加换行符,然后加入 - Javascript

我正在通过 reactjs 中的数据进行映射。这个 JSX:

{place.venue.location.formattedAddress}

正在通过这个 axios 数据请求进行映射,特别是我响应中的这个数组:

formattedAddress: Array(5)
0 : "Chester Rd"
1 : "London"
2 : "Greater London"
3 : "NW1 4NR"
4 : "United Kingdom"
Run Code Online (Sandbox Code Playgroud)

结果,当我映射时,它返回数据,在一句话中,全部连接在一起。就像这样:

Serpentine RdHyde ParkGreater LondonW2 2TP
Run Code Online (Sandbox Code Playgroud)

我正在尝试通过换行符进行映射、拆分和连接,但它不起作用。我的地址完全停止出现。我究竟做错了什么?

这是我的代码,(我已经切片,所以我可以删除地址末尾的国家/地区)。

{place.venue.location.formattedAddress.slice(0,4).split(',').join('<br />')}
Run Code Online (Sandbox Code Playgroud)

javascript arrays split join reactjs

3
推荐指数
1
解决办法
4310
查看次数