vue页面中引入样式文件在style标签里怎么写，另外import引入样式和require有什么区别

在Vue页面中引入样式文件应该写成：

<style lang="scss">
  @import './styles/main.scss';
</style>

其中lang属性可以根据所需的预处理器选择不同的值，如scss、less等。

关于import引入样式和require的区别，主要有以下几点：

1. 语法不同：require是CommonJS的导入方式，在Node.js中使用较多；而import是ES6的语法，在浏览器中使用较多。

2. 执行时机不同：require是同步加载，执行到require语句时会立即加载并执行模块代码；而import是异步加载，需要等到模块代码执行到import语句时才会执行。

3. 功能不同：require只能加载CommonJS模块或Node.js模块；而import可以加载CommonJS模块、ES6模块以及其他模块。

4. 变量命名不同：require将模块中导出的变量作为一个对象的属性，在引入时需要指定属性名；而import可以将模块中导出的变量直接命名为引入变量名。