vue项目搭建

vue webpack 配置 vue脚手架(以下命令均在cdm里操作,步骤具体如下)

1)cnpm i vue-cli -g (安装vue所需配置)

2)cd 路径 回车 (进入项目里,如不在c盘,先转盘,如  d:回车-》进入到d盘,再cd 路径 回车)

3)vue init webpack vue2  (vue init (初始化)用webpack创建一个项目,项目名叫vue2)

会问:?Project name (vue2)    项目名确认,不改就回车

          ?Project description (A Vue.js project)  项目描述 可以先写点描述(英文写)回车

          ?Author  作者:可写自己名(英文),不写就回车

          ?Vue build (Use arrow keys)

            >Runtime + Compiler: recommended for most users

            (是否安装Runtime+Compiler:recommended for most users  )    直接回车 推荐选第一个

          ?Install vue-router? Y 回车 (是否下载路由) y 回车

          ?Use ESLint to lint your code? N 回车 (检查代码是否规范) n 回车

          ?Set up unit tests(Y/N)  (单元测试)  n 回车

          ?Setup e2e tests with Nightwatch? n 回车

          ?Should we run npm `install` for you after the project has been created?  (recommended)

            yes,use NPM

            yes,use Yarn

            No,I will handle that myself   

              此处用上下键控制,选择最后一项No,will handle that myself  回车 

              之前建立的文件夹中会生成vue2文件夹       

4)cd vue2 (进入vue2)

5)cnpm i (下载)

6)cnpm run dev  (平时看效果时输入)----------------------------------------------------------------------------

    (弹出网址,可以复制放在网页上访问  Your application is running here: http://localhost:8080)

      访问后出现vue页面,这个8080的控制台一直开着,当服务器用,否则8080无法访问了

7)cnpm run build( 最后开发完成时,用webpack打包导出:执行后多了个dist文件夹,这些是最后需要的文件)

vue2文件夹简单介绍:

          build文件夹是最后要怎样去创建,是webpack里的,用来帮助打包文件

          config文件夹:怎样去打包,所有配置文件都在里面

          src文件夹:是我们写代码的地方,里面的assets文件夹是放静态资源的;components文件夹是放组件的;router文件夹是路由,里面是路由的配置信息;App.vue是全局的组件,

          static文件夹:放静态资源,比如以后要放的包

          .babelrc文件,将ES6转成html5

          package.json文件:记录了项目需要的文件,依赖项

          README.md文件:文档,简书

          index.html:文件入口

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容