css - 在安全网络上使用 mdbvue，缺少样式

Question

我跟着这个教程

更重要的是，本教程：https ://mdbootstrap.com/vue/components/buttons/

我最终得到了这个：

所以我显然在这里缺少风格。我是 vue 新手，对 nodejs 还是新手，所以我很不知道应该在哪里以及如何包含样式。

这是我的代码：

应用程序.vue

<template>
  <div :class="$style.App">

    <ButtonPage />

  </div>
</template>

<script>
import ButtonPage from './components/ButtonPage.vue'
const safenetwork = require('./safenetwork.js');

export default {
  name: 'App',
  components: {
    ButtonPage
  },
  async created() {
    await safenetwork.authoriseAndConnect();
  }
}
</script>

按钮页面.vue

<template>
  <btn outline="primary" size="lg">Button</btn>
</template>

<script>
import { Btn } from 'mdbvue';

export default {
  name: 'ButtonPage',
  components: {
    Btn
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>

包.json

{
  "name": "Site-Yropeen",
  "version": "1.0.0",
  "description": "Yropeên",
  "homepage": "https://gitlab.com/UniversalBasics/Yropeen/Site-Yropeen",
  "keywords": [
    "conlang",
    "European"
  ],
  "author": "Folât Sômêjpjêr <folatt@guilder-test.eu.org>",
  "contributors": [],
  "license": "GPL-3.0+",
  "main": "index.js",
  "scripts": {
    "build": "neutrino build",
    "start": "neutrino start"
  },
  "repository": {
    "type": "git",
    "url": "git://gitlab.com/UniversalBasics/Yropeen/Site-Yropeen/Site-Yropeen.git"
  },
  "dependencies": {
    "@babel/helper-module-imports": "v7.0.0-beta.51",
    "mdbvue": "4.*.*",
    "vue": "2.*.*",
    "vue-router": "3.*.*"
  },
  "devDependencies": {
    "@neutrinojs/vue": "8.*.*",
    "babel-plugin-transform-runtime": "6.*.*",
    "babel-preset-stage-2": "6.*.*",
    "jquery": "3.*.*",
    "neutrino": "8.*.*",
    "webpack": "3.*.*"
  }
}

Answer 1

包.json

...
"dependencies": {
    "mdbootstrap": "~4.5.0"
  },
...