Загрузка библиотек узлов в Vue. js - PullRequest
Новая
       22

Загрузка библиотек узлов в Vue. js

0 голосов
/ 05 февраля 2020

Прежде всего, я изучаю веб-приложения самостоятельно, используя Vue 2 + технологию Firebase. Пояснения к манекенам очень приветствуются.

Я пытаюсь перечислить корзины из облачного хранилища (Google Cloud Platform) в моем интерфейсе. Поэтому я нашел узел library , чтобы выполнить эту задачу. Я создал компонент Vue для вывода списка блоков, но когда я пытаюсь импортировать библиотеку узлов в компонент (внутри тега скрипта) 

import storage from '@google-cloud/storage'

, я получаю эту ошибку: 

 ERROR  Failed to compile with 1 errors                                                         13:34:51
 error  in ./node_modules/configstore/index.js

Module parse failed: Unexpected token (26:4)
You may need an appropriate loader to handle this file type.
|               if (defaults) {
|                       this.all = {
|                               ...defaults,
|                               ...this.all
|                       };

 @ ./node_modules/gcs-resumable-upload/build/src/index.js 19:20-42
 @ ./node_modules/@google-cloud/storage/build/src/file.js
 @ ./node_modules/@google-cloud/storage/build/src/index.js
 @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0&bustCache!./src/components/Bucket.vue
 @ ./src/components/Bucket.vue
 @ ./src/router/index.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

Я даже не знаю, возможно ли использовать библиотеку такого типа в Vue компоненте, или мне нужна внутренняя среда node.js. Прежде чем продолжить разработку компонента, я хочу узнать, возможно ли использовать библиотеку узлов в компоненте, потому что я довольно растерялся по этому поводу.

Это мои версии зависимостей в случае необходимости: 

"dependencies": {
    "@google-cloud/storage": "^4.3.0",
    "axios": "^0.19.2",
    "firebase": "^7.8.0",
    "googleapis": "^47.0.0",
    "vue": "^2.5.2",
    "vue-firestore": "^0.3.30",
    "vue-router": "^3.0.1",
    "vuetify": "^2.2.8"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.22.1",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-loader": "^7.1.1",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-plugin-transform-vue-jsx": "^3.5.0",
    "babel-preset-env": "^1.3.2",
    "babel-preset-stage-2": "^6.22.0",
    "chalk": "^2.0.1",
    "copy-webpack-plugin": "^4.0.1",
    "css-loader": "^0.28.0",
    "extract-text-webpack-plugin": "^3.0.0",
    "file-loader": "^1.1.4",
    "friendly-errors-webpack-plugin": "^1.6.1",
    "html-webpack-plugin": "^2.30.1",
    "node-notifier": "^5.1.2",
    "optimize-css-assets-webpack-plugin": "^3.2.0",
    "ora": "^1.2.0",
    "portfinder": "^1.0.13",
    "postcss-import": "^11.0.0",
    "postcss-loader": "^2.0.8",
    "postcss-url": "^7.2.1",
    "rimraf": "^2.6.0",
    "semver": "^5.3.0",
    "shelljs": "^0.7.6",
    "uglifyjs-webpack-plugin": "^1.1.1",
    "url-loader": "^0.5.8",
    "vue-loader": "^13.3.0",
    "vue-style-loader": "^3.0.1",
    "vue-template-compiler": "^2.5.2",
    "webpack": "^3.6.0",
    "webpack-bundle-analyzer": "^2.9.0",
    "webpack-dev-server": "^2.9.1",
    "webpack-merge": "^4.1.0"
  },
  "engines": {
    "node": ">= 6.0.0",
    "npm": ">= 3.0.0"
  },

Спасибо

1 Ответ

2 голосов
/ 05 февраля 2020

Этот пакет @google-cloud/storage предназначен для Node.js среды, и поэтому он не работает в браузере. В npm репозиториях вы найдете почти все, но вам действительно нужно знать, для какой платформы он предназначен. Чтение документов обычно помогает понять, если вы нашли правильный пакет.

Чтобы это работало, вам понадобится некоторый уровень API Node, на котором вы будете использовать @google-cloud/storage, а в вашем приложении Vue вы затем будете использовать этот API.

...