添加小程序,兑换各种视频教程/数据资源。

 

  1.使用vue ui创建、管理项目:可视化的项目管理工具。

步骤:

      a.在已经下载node v8.9版本以上的情况下(百度怎么下载node已经怎么更新node),程序输入cmd->下载vue cli3.0以上(输入npm install -g @vue/cli)-通过vue ui可视化管理工具打开项目(输入vue ui),浏览器即可打开http://localhost:8000。已经下载了node8.9版本以上,vue cli3.0的直接在程序cmd命令行中输入vue ui回车即可。

      b.http://localhost:8000做如下设置:

100100100

100

    

基于vue cli3+的项目文件目录:
    pulic文件:
        favicon.ico是网址上方的标题的小图标。
        index.html:是入口文件模板。
    src:项目的主文件。
        assets:是存放静态资源(如:图片,css等)的文件。
            img:存放图片。
            css:存放共同css样式。
            js:存放第三方js文件。
            iconfont:存放图标文件。
        api:存放封装的axios文件,有拦截功能。
        components:可复用的局部组件。
        views:页面组件。
        config:项目的配置文件。
            index.js:config文件的入口。
        directive:自定义指令。
            index.js:directive文件的入口。
        lib:存放工具和与业务相关的文件。
            tool.js:存放与业务逻辑无关的工具,如封装的js函数,cookie函数。
            util.js:存放与业务逻辑相关的,如配置的路由的变量。
        router:存放路由相关的。
            router.js:存放路由的配置。
            index.js:存放路由的导出。
        store:vuex的状态管理器。
            store.js:全局状态管理。
            action.js:
            getter.js:
            mutations.js:
            index.js:
            plugin:存入模块文件。
                user.js:存入登录的相关状态管理。
         mock:模拟后台的json数据,npm install mockjs -D。
            index.js:import mock form "mockjs"。
    package.json:
        dependencies:项目打包依赖。
        devDependencies:项目开发依赖。
    .babel.config.js:css自动补充兼容性代码。
    .gitignore:git提交得忽略文件。
    .eslintrc.js:eslint校验规则,可以自定义。
    .editorconfig:编辑器的配置。参考https://blog.csdn.net/qq_42231156/article/details/106929041。
    vue.config.js:配置文件入口,包括跨域代理,项目文件的基本路径,以及路径的简写/src简写为@。
            

 

Logo

前往低代码交流专区

更多推荐