Question

嗯，在研究这个时，我没有在其他地方找到任何东西。但是，我想将样式表导出到我的应用程序的其余部分。以下是ES5，我想将其转换为ES6。甚至facebook.github在这个问题上也不清楚。我的ES5代码是：

var fontFamily = 'Comic Sans MS, Lucida Handwriting, cursive';
var background = 'pink url("https://media.giphy.com/media/oyr89uTOBNVbG/giphy.gif") fixed';
var fontSize   = '4em';
var padding = '45px 0';
var color  = 'green';

module.exports = {
  fontFamily: fontFamily,
  background: background,
  fontSize: fontSize,
  padding: padding,
  color: color
};

任何人都可以帮忙吗？到目前为止我正在尝试：

export default {
  fontFamily: fontFamily,
  background: background,
  fontSize: fontSize,
  padding: padding,
  color: color
};

Answer 1

有很多方法可以做到，但这里有两个例子。

有关导出声明的详细信息，请参阅https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export。

方式1

<强>导出

export const styles = {
  fontFamily: 'Comic Sans MS, Lucida Handwriting, cursive',
  background: 'pink url("https://media.giphy.com/media/oyr89uTOBNVbG/giphy.gif") fixed',
  fontSize  : '4em',
  padding: '45px 0',
  color : 'green',
};

<强>导入

import { styles } from './styles';
const fontFamily = styles.fontFamily;
console.log(fontFamily) // Comic Sans MS, Lucida Handwriting, cursive

方式2

<强>导出

const fontFamily = 'Comic Sans MS, Lucida Handwriting, cursive';
const background = 'pink url("https://media.giphy.com/media/oyr89uTOBNVbG/giphy.gif") fixed';
const fontSize   = '4em';
const padding = '45px 0';
const color  = 'green';

export { fontFamily, background, fontSize, padding, color };

<强>导入

import { fontFamily, color } from './styles';
console.log(fontFamily, color); // Comic Sans MS, Lucida Handwriting, cursive green

使用ES6导出样式表

1 个答案: