在Vue-cli+webpack中导入static.js

Question

我使用vue-cli已经有一段时间了，但仍然不完全了解如何加载文件。从现在起，我阅读了一些文档和博客，并帮助我处理它。

我想在组件中导入带有一些常量的静态.js文件。我不希望在部署时将它们捆绑在一起，这样就可以很容易地找到它们并进行更改，如果需要，可以直接在服务器中进行更改，而无需重新构建整个项目。

我试图将它们放在/public/contents/foo.js目录中，并以不同的方式使用绝对路径指向它们

import FOO from '/constants/foo.js';  // Not working
const FOO = require('/constants/foo.js');  // Not working

我怎样才能做到这一点？

Answer 1

如果我很了解你的项目架构就像

/root
|__/public
|     |__/img
|     |__/css
|     |__/constants
|            |__/foo.js
|            |__/bar.js
|__/webpack.config.js

在webpack.config.js中创建一个类似的新条目

module.exports = {
entry: './public/index.js'
};

然后在您的公共目录中创建一个index.js文件并导入您的foo.js

import foo from './constants/foo';

当然，你的foo.js应该导出类似的东西

export default function foo() {
//
}

希望这对你有帮助。