vue-ipfs Can't resolve 'dns' in '/home/xxx/dev/group/node_modules/multiaddr/src/resolvers'

[scenaristeur]

• Version: Linux Mint, "ipfs": "^0.52.2",

using npm run serve (@vue/cli),

i've got first this error

98% after emitting CopyPlugin

 WARNING  Compiled with 1 warning                                         21:06:05

 warning  in ./node_modules/multiaddr/src/resolvers/dns.js

Module not found: Error: Can't resolve 'dns' in '/home/david/dev/group/node_modules/multiaddr/src/resolvers'

then i get this error in the browser

my code is like that

    const ipfs = await this.$ipfs;
        // Call ipfs `id` method.
        // Returns the identity of the Peer.
        const { agentVersion, id } = await ipfs.id();
        this.agentVersion = agentVersion;
        this.id = id;
        // Set successful status text.
        this.status = "Connected to IPFS =)";
        const doc = JSON.stringify({
          foo: "bar",
          tic: "tac"
        });

        const cid = await ipfs.add(doc);

        console.log("IPFS cid:", cid);
        let res1 = await ipfs.cat(cid)
        let res = await ipfs.cat('https://cid.ipfs.io/#'+cid.path)
        console.log(res1, res)

with this package.json

{
  "name": "GRoup",
  "version": "0.0.28",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "git": "npm run build && git add . && git commit -m",
    "postgit": "git push && git subtree push --prefix dist origin gh-pages"
  },
  "dependencies": {
    "@editorjs/checklist": "^1.3.0",
    "@editorjs/code": "^2.6.0",
    "@editorjs/delimiter": "^1.2.0",
    "@editorjs/embed": "^2.4.0",
    "@editorjs/header": "^2.6.1",
    "@editorjs/inline-code": "^1.3.1",
    "@editorjs/list": "^1.6.1",
    "@editorjs/marker": "^1.2.2",
    "@editorjs/paragraph": "^2.8.0",
    "@editorjs/quote": "^2.4.0",
    "@editorjs/raw": "^2.3.0",
    "@editorjs/simple-image": "^1.4.0",
    "@editorjs/table": "^1.3.0",
    "@editorjs/warning": "^1.2.0",
    "@inrupt/solid-client": "^1.2.0",
    "@inrupt/vocab-common-rdf": "^0.6.3",
    "@solid/query-ldflex": "^2.11.3",
    "bootstrap": "^4.5.3",
    "bootstrap-vue": "^2.20.1",
    "codeflask": "^1.4.1",
    "core-js": "^3.6.5",
    "dayspan-vuetify-2": "^0.2.0",
    "ipfs": "^0.52.2",
    "material-design-icons-iconfont": "^6.1.0",
    "rdf-namespaces": "^1.9.2",
    "register-service-worker": "^1.7.1",
    "solid-auth-cli": "^1.0.15",
    "solid-auth-client": "^2.5.4",
    "solid-file-client": "^1.2.2",
    "tripledoc": "^4.4.0",
    "uuid": "^8.3.1",
    "vue": "^2.6.12",
    "vue-editor-js": "^2.0.1",
    "vue-infinite-scroll": "^2.0.2",
    "vue-router": "^3.2.0",
    "vue-sidebar-menu": "^4.7.4",
    "vuetify": "^2.3.20",
    "vuex": "^3.4.0"
  },
  "devDependencies": {
    "@editorjs/personality": "^2.0.2",
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-pwa": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "node-sass": "^4.12.0",
    "sass": "^1.19.0",
    "sass-loader": "^8.0.2",
    "vue-cli-plugin-vuetify": "~2.0.8",
    "vue-template-compiler": "^2.6.11",
    "vuetify-loader": "^1.3.0"
  }
}

--> it seems that

• this.id , this.agentVersion & ifps.add(doc) works
  but not ifps.cat() even for res1 or res

• ws looks at 127.0.0.1:8081 for pears whereas my app is on port 8080

Does anyone see any possible fix ?

[welcome]

Thank you for submitting your first issue to this repository! A maintainer will be here shortly to triage and review.
In the meantime, please double-check that you have provided all the necessary information to make this process easy! Any information that can help save additional round trips is useful! We currently aim to give initial feedback within two business days. If this does not happen, feel free to leave a comment.
Please keep an eye on how this issue will be labeled, as labels give an overview of priorities, assignments and additional actions requested by the maintainers:

• "Priority" labels will show how urgent this is for the team.
• "Status" labels will show if this is ready to be worked on, blocked, or in progress.
• "Need" labels will indicate if additional input or analysis is required.

Finally, remember to use https://discuss.ipfs.io if you just need general support.

[achingbrain]

The lines about dns is a warning, not an error. You can see in the multiaddr source that when it can't load the dns module, it falls back to dns-over-http-resolver.

The websocket console errors are are similar to that reported in #2938 and will be resolved by IPFS upgrading to libp2p@0.30.x which is in progress at #3427.

this.id , this.agentVersion & ifps.add(doc) works but not ifps.cat() even for res1 or res

Please refer the core-api documentation, it explains the API methods you are trying to invoke:

// no
const cid = await ipfs.add(doc)

// yes - https://github.com/ipfs/js-ipfs/blob/master/docs/core-api/FILES.md#ipfsadddata-options
const { cid } = await ipfs.add(doc)

// no
let res = await ipfs.cat('https://cid.ipfs.io/#'+cid.path)

// yes - https://github.com/ipfs/js-ipfs/blob/master/docs/core-api/FILES.md#ipfscatipfspath-options
const bufs = []

for await (const buf of ipfs.cat(cid)) {
  bufs.push(buf)
}

// ...do something with bufs

Please can you use https://discuss.ipfs.io/ for this sort of request in future, questions asked there are much more visible than github issues which tend to vanish after they've been closed.