vue 项目开发简介

搭建项目架构：

1.新建个项目文件： 命名sjd  

  $ mkdir sjd

2.进入项目目录sjd  初始化这个项目

cd sjd

 vue init webpack

3.安装package.json里项目的依赖包

cnpm install 

4.引入element vue 组件

npm install element-ui --save

完整引入项目

import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
import App from './App.vue'

Vue.use(ElementUI)

new Vue({
  el: '#app',
  render: h => h(App)
})

 

//用export default 封装组件代码，让外部可以引用。  data 的写法

export default{
        name:'post',
        data(){
         return{
                   msg: '小菜鸟'
               }
      }  
       }, 

vue 实例化的 data

var  vc = new Vue({
                        el:'#app',
                        data:{
                            message:'hello'
                        }
                    })    

 结束后开始打包文件：

1、把绝对路径改为相对路径

我们打开config/index.js 会看到一个build属性，这里就我们打包的基本配置了。你在这里可以修改打包的目录，打包的文件名。最重要的是一定要把绝对目录改为相对目录。

assetsPublicPath:'./'

 

2、在命令行中用npm run build  进行打包。

 

 3.在打包结束后文件多出个 dist文件  把这个文件放到服务器上 ok