将外部 javascript 和 css 文件链接到 Vue 组件？答案

【问题标题】：Linking external javascript and css files into Vue component?将外部 javascript 和 css 文件链接到 Vue 组件？
【发布时间】：2017-04-13 03:18:35
【问题描述】：

我使用 javascript 和 CSS 创建了一个功能性棋盘。我想在 Vue 应用程序中使用它，但我不知道如何将 javascript 和 CSS 文件链接到组件。有没有办法在 webpack 中加载它们，或者正确的方法是什么？

【问题讨论】：

如果你使用 webpack 和 babel，你可以像模块一样导入它们

标签： node.js vuejs2

【解决方案1】：

这应该有帮助

<style scoped>
    @import '../assets/css/custom.css';
</style>

【讨论】：

【解决方案2】：

只需按照本教程为您的项目配置 webpack。

http://todarman.com/configuring-webpack-es6-sass/

配置好 webpack.config.js 文件后，在你的项目目录下打开终端，运行命令 npm run dev。我将在各自的目录中构建 js 和 css 文件。您可以将这些文件链接到您的 index.html 文件中。

<html>
<head>
<title>Webpack index page</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
  <h2>webpack configuration</h2>

  <script src="js/bundle.js"></script>
</body>
</html>

希望这会有所帮助。

【讨论】：

鼓励链接到外部资源，但请在链接周围添加上下文，以便您的其他用户了解它是什么以及为什么存在。始终引用重要链接中最相关的部分，以防目标站点无法访问或永久离线。