vue项目目录

vue项目目录相关知识

• npm（node packaged modules） 使用国内镜像 cnpm

  Windows CMD环境 先安装好nodejs CMD命令运行 npm install -g cnpm --registry=https://registry.npm.taobao.org ================= 安装vue.js实例： 全局安装vue-cli cnpm install -g vue-cli cd 进入将要安装vue.js项目目录 vue init webpack 项目文件夹名称 安装vue项目目录下package.json中的依赖 cnpm install 更多请访问：http://npm.taobao.org/
• vue+cordova构建跨平台应用集成并使用Cordova plugin

  安装//安装 vue-cilnpm install --global vue-cli//安装cordova npm i cordova -gcordova 新建项目//新建cordova 项目 cordova create vue-cordova //进入目录 cd vue-cordova //vue-cli新建vue项目 vue init webpack vueprojectname //进入vue 项目目录 cd vueprojectname //安装依赖 npm i运行项目npm run dev编译项目npm run build修改编译输出打开vue项目目录下面的index.html，添加<script src="cordova.js">&lt
• 项目中使用vue-awesome-swiper

  一.简介Swiper常用于移动端网站的内容触摸滑动Swiper是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端，以及PC端网站。Swiper能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。下载安装打开 surmon-china/vue-awesome-swiper，参考安装使用教程。1. 选用npm下载安装项目目录win7下，cmd终端，进入根目录，cnpm install vue-awesome-swiper@2.6.7 --save我的网速慢，使用cnpm代替npm，@2.6.7表示安装的版本，--save本地测试还是项目上线，都会用到vue-awesome-swiper@2.6.7安装完成后，在项目的node_modules目录下会找到2.使用全局挂载：import Vue from 'vue'import VueAwesomeSwiper from 'vue-awesome-swip
• Vue项目打包上传问题

  2018年5月4日打卡这几天在研究nuxt.js，因为想重构公司的官网，但用vue这个spa单页应用又不利于网页的seo，在浏览别的的博客中，我发现了nuxt这个框架，可以说完全的解决了我的问题啊。当然本篇文章还是主要讲解记录了vue项目的打包，因为我发现用nuxt做出来的应用无法放在服务器的二级目录下，一定要放在根目录下，这就让我很难受了，网上也没有解决办法。因为之前我用vue做出来的项目网上教授了放在二级根目录的方法，所以我理所应当的把所有vue做出来的项目都放在了服务器的二级目录下（现在想起来真的很蠢），即使会出现刷新404的问题，奈何本人懒，也就不深究了。谁能想到，终究还是回到了vue项目打包上传服务器的这一步，进过一番研究，总算搞清楚了，原谅我的啰嗦，真的是难以抑制内心的激动之情，感觉世界都清明了。。。。。_好了，不说了，上教程。首先，vue项目使用npm run build来进行打包操作，这个都知道吧打包完成后在项目中生成一个dist的文件夹，里面的内容就是咱们要传到服务器的

vue项目目录相关课程

• (打造简历金牌项目)Vue+Go 开发企业级微服务网关项目 本课程带你手把手设计并实现一个通用型前端+后端一体的微服务网关项目，同时利用Go语言本身的性能优势，打造网关的优越性能，提升自身硬实力，还能收获微服务网关项目作品，丰富个人简历。

  讲师：牛儿吃草 中级 1202人正在学习

• Vue核心技术 Vue+Vue-Router+Vuex+SSR实战精讲 这是一门重技术讲解的课程，通过一个Todo应用深入讲解Vue应用开发，Vue+Webpack工作流搭建，Vue+Vue-Router+Vuex项目架构和Vue服务端渲染深度集成，以此给学员展示Vue应用开发中的各种问题和优质解决方案。

  讲师：Jokcy 高级 3116人正在学习

• 混合开发入门 Vue结合Android/iOS开发仿京东项目App 本课程融合Vue、Android等流行的前端和移动端技术，混合开发经典电商APP——京东。课程将复杂功能与知识点完美融合，带你真实感受到明星级产品开发的全过程。除此之外，还有一流用户体验和优秀交互设计等你一探究竟，拓宽开发眼界。

  讲师：Sunday 初级 995人正在学习

vue项目目录相关教程

• 2. uni-ui 项目目录介绍 创建项目时，我们可以选择创建什么类型的模板，如果选择 uni-ui 项目模板，系统就会自动帮我们生成下面的项目目录。各文件的作用如下：文件名称作用 components 是一个用来存放组件的文件夹，从外部引用的组件，或者自己自定义的组件都是放在这个文件夹中 pages 是一个用来存放所有页面的文件夹，也是我们经常操作的一个目录 static 是一个存放静态资源的文件夹，例如图片等 unpackage 是打包目录，存放打包后的文件。有些新建项目目录中没有这个文件夹，在微信开发者工具等编译平台运行后，也会生成这个文件。App.vue 是页面入口文件，所有页面都是在 App.vue 下进行切换的，可以调用应用的生命周期函数 main.js 是项目入口文件，主要用来初始化 vue 实例并使用需要的插件 manifest.json 是应用配置文件，用于指定应用的名称、图标、权限等 pages.json 是全局配置文件，可以配置页面文件路径、窗口样式、原生的导航栏、底部 tab 栏等 uni.scss 是 uni-app 的样式包。在其他文件中可以快速引用样式包里面的样式其中 unpackage 打包目录，存放的是打包后的文件，有时候打包后会出现图片或者组件失效的情况，可以检查一下引用路径是否有错误。
• 2.1 项目的目录结构 本实例我们一共需要创建两个文件，其一是 maven 的工程描述文件 pom.xml 我们把它放在工程的根目录下；其二是 Spring Boot 项目的启动文件 HelloSecurityApplication.java。完整的目录描述如下：├── pom.xml├── src/ └── main/ └──java/ └──imooc/ └──springsecurity/ └──HelloSecurityApplication.java
• 3. Hello uni-app 项目目录介绍 创建项目时，选择 Hello uni-app 项目模板，项目创建完成后，会帮我们生成下面的项目目录。其中有几个文件与 uni-ui 项目目录重复了，作用都是一样的。各文件的作用如下：文件名称作用 common 是存放公共 js 和 css 的文件夹 components 是用来存放组件的文件夹 hybrid 是存放本地网页 .html 文件的文件夹 pages 是用来存放所有页面的文件夹 platforms 是存放各平台专用页面的文件夹，如果想把各平台的页面文件更彻底的分开，可以 platforms 目录中创建子目录，存放不同平台的页面文件 static 是存放静态资源的文件夹 store 是 vuex 状态管理文件夹，在 uni-app 项目内置了 vuex，使用时直接在 main.js 里面配置一下就可以了 wxcomponents 存放小程序组件的目录，详见 2.1unpackage 打包目录 App.vue 页面入口文件 main.js 项目入口文件 manifest.json 应用配置文件 package.json 是项目的主配置文件，里面包含了 uni-app 项目的基本描述信息、项目所依赖的各种第三方库以及版本信息、以及可执行的脚本信息 pages.json 全局配置文件 template.h5.html 是 h5 端的网页模板文件 uni.scssuni-app 的样式包
• 2. 目录结构 首先我们先看以下用 Vue-Cli 创建项目的整体结构：项目相关的代码，我们都放在 src 的文件夹中，该文件夹中的结构如下：assets 是资源文件夹，通常我们会把图片资源放在里面。components 文件夹通常会放一些组件。router 文件夹里面放的是 VueRouter 的相关配置。store 文件夹里面放的是 Vuex 的相关配置。views 文件夹里面通常放置页面的 .vue 文件。App.vue 定义了一个根组件。main.js 是项目的入口文件。Vue-Cli 给我们提供了一个默认的项目文件结构，当然你并不是一定要按照这个文件结构来编写项目，你完全可以根据项目的需要或者个人喜好对项目结构加以改写。
• 4. vue-cli 命令行创建项目 我们在终端通过 vue-cli 命令行创建 uni-app 项目，在创建项目之前，需要保证电脑已经配置了 nodejs 环境。
• 3.2 转移项目文件 我们准备好现成的 mpvue 项目，现在将 mpvue 项目中的文件复制到刚刚创建好的 uni-app 项目中。3.2.1 mpvue 项目中的 src/components 文件夹复制到 uni-app 项目根目录下复制完成后 uni-app 目录效果如下：3.2.2 mpvue 项目中的 src/pages文件夹替换掉到 uni-app 项目根目录下面的pages文件夹，并删除每个页面目录中的 main.js 和main.json 文件后面main.json 文件中的配置都会转移到 pages.json 文件中。操作完成后 uni-app 目录效果如下：3.2.3 配置 pages.json 文件，根据 mpvue 项目的 app.json 和 main.json 文件中的页面配置信息来填写需要注意以下几点：将 pages 配置项中的项目路径改成 .vue 页面的路径，比如将 "pages/index/main" 改成 "pages/index/index"。并将 main.json 文件中的配置写到每个 page 中的 style 配置项中；将 window 配置项改成 globalStyle 配置项。实例：mpvue 项目的app.json文件。{ "pages": [ "pages/index/main", "pages/me/main" ], "window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#EA5149", "navigationBarTitleText": "慕课网", "navigationBarTextStyle": "black" }}转换成 uni-app 项目的 pages.json文件。{ "pages": [ { "path": "pages/index/index", "style": {// 原是 main.json 文件中的配置 "enablePullDownRefresh":true } }, { "path" : "pages/me/me", "style" : {} } ], "globalStyle": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#EA5149", "navigationBarTitleText": "慕课网", "navigationBarTextStyle": "black" }}3.2.4 将其他文件也复制到 uni-app 项目中主要有以下几个文件：mpvue 项目中的 src/App.vue 文件替换掉 uni-app 项目根目录下的 App.vue 文件；mpvue 项目中的 src/main.js 文件替换掉 uni-app 项目根目录下的 main.js 文件，还有其他 src 文件夹下面的 .js 文件也一并复制过来；mpvue 项目中的 src/units 文件夹粘贴到 uni-app 项目根目录下；mpvue 项目根目录下的 static 文件夹替换掉 uni-app 项目根目录下的 static 文件夹。

vue项目目录相关搜索

vacuum vagrant val validationgroup validationsummary vals valueof values vant variables vb vb if else vb if语句 vb net vb net 教程 vb net 数据库 vb net教程 vb net下载 vb 教程 vb 数组

查看更多慕课网实用课程