Vue-CLI 与 webpack 添加外部 Css 和 Js 文件

【问题标题】：Vue-CLI with webpack add external Css and Js fileVue-CLI 与 webpack 添加外部 Css 和 Js 文件
【发布时间】：2017-08-30 11:20:03
【问题描述】：

我使用Vue-cli 和webpack，但在index.html 中调用外部js 和css 文件时遇到问题。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>gradana</title>
    <link rel="stylesheet" href="./src/assets/css/hello.css">
  </head>
  <body>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

如果我运行代码就会出错。

Cannot GET /src/assets/css/hello.css

【问题讨论】：

我找到了解决方案：我在 App.vue 中添加代码

标签： webpack vuejs2 vue-cli

【解决方案1】：

当你使用vue cli时，assets文件夹将在打包过程中被webpack处理，assets文件夹中的那些文件应该被js所包含

e.g.require('../node_modules/bootstrap/dist/css/bootstrap.min.css').

或者您可以简单地将CSS 或JS 文件存储到/static 文件夹中，static 文件夹中的所有文件将在运行应用程序时添加到/dist 文件夹中。

然后将其调用到index.html

CSS

<link rel="stylesheet" href="/static/css/hello.css">

<script src="/static/scripts/script.js"></script>

【讨论】：

但是这在创建构建后不起作用我尝试了同样的方法但是在生成构建后我得到了 404 任何解决方案？