[聚合文章] vue入门教程

  1. 首页
  2. 聚合文章
  3. 文章详情
JavaScript 2017-11-22 17 阅读
原文链接: http://www.jianshu.com/p/61aed417837d
node_modulesnpm 加载的项目依赖模块src这里是我们要开发的目录，基本上要做的事情都在这个目录里。里面包含了几个目录及文件：assets: 放置一些图片，如logo等；components: 目录里面放了一个组件文件，可以不用；App.vue: 项目入口文件，我们也可以直接将组件写这里，而不使用 components 目录； main.js: 项目的核心文件static静态资源目录，如图片、字体等test初始测试目录，可删除.xxxx文件这些是一些配置文件，包括语法配置，git配置等。index.html首页入口文件，你可以添加一些 meta 信息或同统计代码啥的package.json项目配置文件。README.md项目的说明文档，markdown 格式

基本的标签语法

页面组成

  • 页面由html,css,js三部分组成
    <!-- 展示模板 ，根目录必须为一个标签；引入的自定义标签可以直接通过自定义标签名引入--><template>  <div id="app">    ![](./assets/logo.png)    <hello></hello>  </div></template><script>// 导入组件，注意 data必须为return返回数据；组件中导入的组件通过components导入；import Hello from './components/Hello'export default {  name: 'app',  components: {    Hello  }，  data () {    return {      msg: '欢迎来到菜鸟教程！'    }  }}</script><!-- 样式代码  可以使用不同的样式预处理器，比如less,sass等,需要加less+less-loader ；可以使用scope来指定这个模板的样式是针对当前组件还是共用--><style lang='less'　scope>#app {  font-family: 'Avenir', Helvetica, Arial, sans-serif;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;  text-align: center;  color: #2c3e50;  margin-top: 60px;}
                
    注：本文内容来自互联网，旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜，请你联系站长进行处理。