在vue cli3项目中包含我自己的js和CSS文件

Question

我有一些自定义构建的js和css文件，我想将其包含在我的vue cli3项目中。 有什么方法可以将这些文件导入我的项目吗？

Answer 1

对于自定义js文件，将所有逻辑写入一个对象，并将其导出到文件末尾：

const customJs = {
   /* custom javascript here */
}

export default customJs;

，然后将其导入为您需要的位置：

import * as customJs from '../path/to/file.js'

对于自定义css文件，您可以在@import标签之间使用style，如下所示：

@import './../node_modules/foo/bar.css';

Answer 2

使用vue-cli创建项目时，可以使用预处理器。

See: Working with CSS

或者如果您不需要预处理器并且使用的是CSS模块，则可以选择此路线

See: CSS Modules

对于JavaScript，如果您使用的是ES2016 / ES6，则只需使用语法即可，

import tool from 'toolmodulename';

Answer 3

在main.js中尝试

导入“ path-your-css / your-css.css”；