search

AddressForAll / site-v2

New AddressForAll website, version 3 of attempts to make it better
Apache License 2.0
1 stars 0 forks source link

Erro no build ao usar react-vega #42

Open 0e1 opened 2 years ago

0e1 commented 2 years ago

Tentando implementar as diretaivas da issues/38. Após executar 

git clone https://github.com/AddressForAll/site-v2.git
cd site-v2
npm install
npm install react vega vega-lite react-vega
npm run build

num sistema Debian testing a página exibe o gráfico usando react-vega:

import { getStaticPaths, makeStaticProps } from "../../lib/getStatic";
import Layout from "../../components/layout";

import React              from 'react';
import { Vega, VegaLite } from 'react-vega';

const spec1 = {
  "description": "zzz",
  "data": { "url": "https://osm.codes/_sql/stats_donors_prospection"},
  "transform": [{"filter": "datum.donor_status > 0"}],
  "encoding": {
    "y": {"field": "donor_status", "type": "nominal", "title": "donor_status"},
    "x": {"field": "accumulated_amount", "type": "quantitative", "scale": {"domain": [0,150]},"title": "number of donors"},
    "tooltip": [
      {"field": "accumulated_amount", "type": "quantitative"}
    ],
      "color": {"value": "#ff9900"}
  },

  "layer": [{
    "mark": {"type": "bar",},
  }, {
    "mark": {
      "type": "text",
      "align": "left",
      "baseline": "middle",
      "dx": 3
    },
    "encoding": {
      "text": {"field": "accumulated_amount", "type": "quantitative"}
    }
  }]
}

export default function graficosexample() {
  return (
    <Layout>
      <section id="graficos">
        <Vega spec={spec1}/>
      </section>
    </Layout>
  );
}

const getStaticProps = makeStaticProps("common");
export { getStaticPaths, getStaticProps };

é exibida:

Captura de tela de 2022-09-23 20-25-21

Reproduzindo os mesmos passo no servidor da AddressForAll, não foi possível realizar o building:

claiton@addressforall:~$ git clone https://github.com/AddressForAll/site-v2.git
Cloning into 'site-v2'...
remote: Enumerating objects: 1484, done.
remote: Counting objects: 100% (610/610), done.
remote: Compressing objects: 100% (304/304), done.
remote: Total 1484 (delta 310), reused 552 (delta 274), pack-reused 874
Receiving objects: 100% (1484/1484), 48.66 MiB | 21.27 MiB/s, done.
Resolving deltas: 100% (628/628), done.
claiton@addressforall:~$ cd site-v2/
claiton@addressforall:~/site-v2$ npm install

> core-js@3.25.2 postinstall /home/claiton/site-v2/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"

Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!

The project needs your help! Please consider supporting of core-js:
> https://opencollective.com/core-js 
> https://patreon.com/zloirock 
> bitcoin: bc1qlea7544qtsmj2rayg0lthvza9fau63ux0fstcz 

Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)

> core-js-pure@3.25.2 postinstall /home/claiton/site-v2/node_modules/core-js-pure
> node -e "try{require('./postinstall')}catch(e){}"

Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!

The project needs your help! Please consider supporting of core-js:
> https://opencollective.com/core-js 
> https://patreon.com/zloirock 
> bitcoin: bc1qlea7544qtsmj2rayg0lthvza9fau63ux0fstcz 

Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-android-arm-eabi@12.1.6 (node_modules/next/node_modules/@next/swc-android-arm-eabi):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-android-arm-eabi@12.1.6: wanted {"os":"android","arch":"arm"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-android-arm64@12.1.6 (node_modules/next/node_modules/@next/swc-android-arm64):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-android-arm64@12.1.6: wanted {"os":"android","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-darwin-arm64@12.1.6 (node_modules/next/node_modules/@next/swc-darwin-arm64):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-darwin-arm64@12.1.6: wanted {"os":"darwin","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-darwin-x64@12.1.6 (node_modules/next/node_modules/@next/swc-darwin-x64):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-darwin-x64@12.1.6: wanted {"os":"darwin","arch":"x64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-linux-arm-gnueabihf@12.1.6 (node_modules/next/node_modules/@next/swc-linux-arm-gnueabihf):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-linux-arm-gnueabihf@12.1.6: wanted {"os":"linux","arch":"arm"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-linux-arm64-gnu@12.1.6 (node_modules/next/node_modules/@next/swc-linux-arm64-gnu):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-linux-arm64-gnu@12.1.6: wanted {"os":"linux","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-linux-arm64-musl@12.1.6 (node_modules/next/node_modules/@next/swc-linux-arm64-musl):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-linux-arm64-musl@12.1.6: wanted {"os":"linux","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-win32-arm64-msvc@12.1.6 (node_modules/next/node_modules/@next/swc-win32-arm64-msvc):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-win32-arm64-msvc@12.1.6: wanted {"os":"win32","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-win32-ia32-msvc@12.1.6 (node_modules/next/node_modules/@next/swc-win32-ia32-msvc):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-win32-ia32-msvc@12.1.6: wanted {"os":"win32","arch":"ia32"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-win32-x64-msvc@12.1.6 (node_modules/next/node_modules/@next/swc-win32-x64-msvc):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-win32-x64-msvc@12.1.6: wanted {"os":"win32","arch":"x64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.3.2 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN raw-loader@4.0.2 requires a peer of webpack@^4.0.0 || ^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN tsutils@3.21.0 requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.

added 308 packages from 271 contributors and audited 319 packages in 15.67s

82 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

claiton@addressforall:~/site-v2$ npm install react vega vega-lite react-vega
npm WARN raw-loader@4.0.2 requires a peer of webpack@^4.0.0 || ^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN tsutils@3.21.0 requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-android-arm-eabi@12.1.6 (node_modules/@next/swc-android-arm-eabi):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-android-arm-eabi@12.1.6: wanted {"os":"android","arch":"arm"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-android-arm64@12.1.6 (node_modules/@next/swc-android-arm64):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-android-arm64@12.1.6: wanted {"os":"android","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-darwin-arm64@12.1.6 (node_modules/@next/swc-darwin-arm64):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-darwin-arm64@12.1.6: wanted {"os":"darwin","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-linux-arm-gnueabihf@12.1.6 (node_modules/@next/swc-linux-arm-gnueabihf):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-linux-arm-gnueabihf@12.1.6: wanted {"os":"linux","arch":"arm"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-darwin-x64@12.1.6 (node_modules/@next/swc-darwin-x64):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-darwin-x64@12.1.6: wanted {"os":"darwin","arch":"x64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-linux-arm64-gnu@12.1.6 (node_modules/@next/swc-linux-arm64-gnu):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-linux-arm64-gnu@12.1.6: wanted {"os":"linux","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-linux-arm64-musl@12.1.6 (node_modules/@next/swc-linux-arm64-musl):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-linux-arm64-musl@12.1.6: wanted {"os":"linux","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-win32-arm64-msvc@12.1.6 (node_modules/@next/swc-win32-arm64-msvc):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-win32-arm64-msvc@12.1.6: wanted {"os":"win32","arch":"arm64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-win32-ia32-msvc@12.1.6 (node_modules/@next/swc-win32-ia32-msvc):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-win32-ia32-msvc@12.1.6: wanted {"os":"win32","arch":"ia32"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: @next/swc-win32-x64-msvc@12.1.6 (node_modules/@next/swc-win32-x64-msvc):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for @next/swc-win32-x64-msvc@12.1.6: wanted {"os":"win32","arch":"x64"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.3.2 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

+ react@18.2.0
+ vega@5.22.1
+ vega-lite@5.5.0
+ react-vega@7.6.0
added 87 packages from 55 contributors, updated 1 package and audited 406 packages in 12.27s

83 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

claiton@addressforall:~/site-v2$ npm run build

> site-v2@2.1.0 build /home/claiton/site-v2
> next build && next export

info  - Checking validity of types  
error - ESLint: Failed to load plugin '@next/next' declared in '.eslintrc.json » eslint-config-next/core-web-vitals » /home/claiton/site-v2/node_modules/eslint-config-next/index.js': Unexpected token '.' Referenced from: /home/claiton/site-v2/node_modules/eslint-config-next/index.js
info  - Creating an optimized production build  
info  - Compiled successfully

> Build error occurred
/home/claiton/site-v2/node_modules/vega-label/build/vega-label.js:593
      let textWidth = d.textWidth ?? 0,
                                   ^

SyntaxError: Unexpected token '?'
    at wrapSafe (internal/modules/cjs/loader.js:915:16)
    at Module._compile (internal/modules/cjs/loader.js:963:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
    at Module.load (internal/modules/cjs/loader.js:863:32)
    at Function.Module._load (internal/modules/cjs/loader.js:708:14)
    at Module.require (internal/modules/cjs/loader.js:887:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.<anonymous> (/home/claiton/site-v2/node_modules/vega/build/vega-node.js:13:13)
    at Module._compile (internal/modules/cjs/loader.js:999:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10) {
  type: 'SyntaxError'
}
info  - Collecting page data .npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! site-v2@2.1.0 build: `next build && next export`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the site-v2@2.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/claiton/.npm/_logs/2022-09-23T23_22_47_303Z-debug.log

É possível resolver?

elpbatista commented 2 years ago

Para mi funciona con: 

    "next": "12.1.6",
    "react": "^18.2.0",
    "react-dom": "18.2.0",
    "react-vega": "^7.6.0",
    "vega": "^5.22.1",
    "vega-lite": "^5.5.0"

El Error de ESLint quedó solucionado agregando la siguiente línea al inicio de report.js

/* eslint-disable @next/next/no-img-element */