如何用模块化的方式写vuejs

文件结构

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

<template>   <div>    <app-header></app-header>   </div> </template> <style> ... </style> <script>   import AppHeader from './AppHeader.vue'   export default {    name:'app',    props:['data']    data() {     return {}     },    methods: {     handleClick() {}    },    components: {     AppHeader    }   } </script>

template 里是模板代码，这里一般是一个闭合的html标签，比如一个div。

style 里是css代码，这个代码是作用到整个页面的，如果只想作用到当前的模板中，需要用scoped属性

1	<style scoped>

如果想用一些css预处理器，比如sass，只需要声明lang，然后vue-loader就会自动的加载，当然，前提是对应的 sass-loader安装好。

1	<style lang="sass">

 

转载于：https://www.jb51.net/article/130731.htm