vue CLI相关

195 阅读1分钟

安装CLI2:

1、首先要检测node(8.9以上)和npm 的版本 用淘宝镜像比较快

2、其次安装webpack

3、安装vue脚手架-全局安装

npm install -g @vue/cli

注意:上面安装的是Vue CLI3的版本,如果需要想按照Vue CLI2的方式初始化项目是不可以的。 拉取2.X模板

npm install @vue/cli-init -g  安装
vue init webpack my-project   创建初始化

e2e end to end 端到端测试

.gitconfig 可以修改全局作者名

runtime-compiler 和 runtime-only 的区别:

安装:

    vue init webpack runtimecompiler

    vue init webpack runtimeonly

运行过程:

    template -> ast -> render > virtual dom -> UI

    render -> vdom -> UI
        性能更高
        代码量更少

具体代码提现:

    components: { App },
    template: '<App/>'

    render: function(createElement) {
        1.普通用法: createElement('标签', {标签的属性} [''])
        return createElement('h2', {class: 'box'} ['Hello'])
        return createElement('h2', {class: 'box'} ['Hello', createElement('button', ['按钮'])])
    
        2.传入组件对象
        return createElement(cpn)
        return createElement(App)
    }

安装CLI3:

vue create XXX 创建初始化

.vuerc 可以修改全局配置

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

.$mount('#app') 和 el: '#app' 是一样的

vue ui

vue ui 终端执行 跑在本地服务 图形化配置

<template>
    <h2>首页</h2>
</template>

<script>
    export default {
        name: 'Home'
    }
</script>

<style scoped>

</style>