zoukankan      html  css  js  c++  java
  • vue 创建项目

    一.环境搭建  

    1.安装node

    • 官网下载node安装包

    • 傻瓜式安装

    • 万一安装后终端没有node环境,要进行node环境变量的配置(C:Program Files odejs)

    • 可以通过node提供的npm包管理器安装vue脚手架

    • 通过npm安装淘宝镜像cnpm,将nmp指令都修改为cnpm指令(npm install -g cnpm --registry=https://registry.npm.taobao.org)

    2.安装全局vue脚手架

    • 起管理员终端(mac: sudo)

    • cnpm install -g @vue/cli

    • 如果安装失败,检测网络,请npm缓存(npm cache clean --force)后重新安装

    3.创建项目

    • 采用可视化方式创建(vue ui)

    • 命令行

    1.打开终端
    2.去向目标目录(将项目创建在该目录)(cd 目标目录)
    3.指令创建项目(vue creat 项目名)
    4.选择自定义:Manually select features
    5.用空格选取所需插件:Router, Vuex
    6.采用Router的history...
    7.在目标目录创建一个项目名的文件夹,该文件夹就是所创的项目

    4.启动项目

    1.进入项目目录
    2.启动服务器(npm run serve)
    3.退出服务器|刷新服务器(ctrl+c)
    4.项目完成后,在项目目标下可以进行项目打包发布,要提前做配置(npm run build)

    5.项目目录

    dist: 打包的项目目录(打包后会生成)
    node_modules: 项目依赖
    public: 共用资源
    src: 项目目标,书写代码的地方
    -- assets:资源
    -- components:组件
    -- views:视图组件
    -- App.vue:根组件
    -- main.js: 入口js
    -- router.js: 路由文件
    -- store.js: 状态库文件
    vue.config.js: 项目配置文件(没有可以自己新建)

    二.项目开发

    1.vue.config.js

    module.exports={
        devServer: {
            port: 8888
        }
    }
    // 修改端口,选做

    2.main.js

    // 不用修改
    // 采用之前的语法创建根实例
    new Vue({
        el: "#app",
        router: router,
        store: store,
        render: function (h) {
            return h(App)
        }
    })

    3.*.vue

    ```html
    <template>
        <!-- 模板区域 -->
    </template>
    <script>
        // 逻辑代码区域
        // 该语法和script绑定出现
        export default {
            
        }
    </script>
    <style scoped>
        /* 样式区域 */
        /* scoped表示这里的样式只适用于组件内部, scoped与style绑定出现 */
    </style>
    ```
  • 相关阅读:
    kaili开启sshd服务
    开源入侵检测系统OSSEC搭建之二:客户端安装
    OSSEC配置文件ossec.conf中添加mysql服务
    OSSEC 安装执行./install.sh详细信息
    开源入侵检测系统OSSEC搭建之一:服务端安装
    Ossec常用命令
    电子取证工具
    CentOS7安装mysql-server
    区块链技术
    支付标记化(Tokenization)技术
  • 原文地址:https://www.cnblogs.com/di2wu/p/10093554.html
Copyright © 2011-2022 走看看