创建Vue项目过程

创建Vue项目过程


一、建立一个储存vue项目的文件夹
二、在该文件夹目录下的终端输入 npm install --global vue-cli
三、输入 vue init webpack test(test是我的项目名)
四、然后他会询问你一些问题:

1、Project name项目名称(确定按enter,否按N) (`按enter`)
2、Project description (A Vue.js project);项目描述(一vue.js项目)。(随意输入一段简短介绍,不写直接回车也行)	 (按enter) 		
3、Author    ;作者。(确定按enter,否按N)(`按enter`) 、
4、Vue build (Use arrow keys)>    。。。。。(`按enter`) 		
5、Install vue-router? (Y/n);安装的路由?(Y/    n)。(可安可不安,建议安装,因为项目肯定能用上) (`选Y`) 		
6、Use ESLint to lint your code?    (Y/n);使用ESlint语法?(Y/    n)。(使用ESLint语法,就要做好心理准备,除非你非常懂ESLint语法,要不就会处处报错,建议N) (`选N`) 		
7、Setup    unit tests with Karma + Mocha? (Y/n);设置单元测试?(Y / n)。(`选N`) 		
8、Setup    e2e tests with Nightwatch? (Y/n);Nightwatch建立端到端的测试?(Y / n)。(`选N`)
9、should we run ‘npm install’ for you after the ogject has been    created? ;(选择Yes,use NPM)(`按enter`)

五、项目创建好之后可打开此文件夹,这样打开终端输入的时候不需要cd test到这个文件夹了。
六、安装部分功能:

1、vue项目安装使用stylus步骤

  • 1.输入npm install stylus -D

  • 2.输入npm install stylus-loader css-loader style

  • 3.找到webpack.base.conf.js文件,并在其中rules写入配置

    {
           test:/\.css$/,
           loader:'style-loader!css-loader!stylus-loader',
           exclude: /node_modules/
     }
    
  • 4.在组建内部的style标签中,加入scoped lang='stylus' rel='stylesheet/stylus'

2、vue项目安装axios,输入npm install axios
3、vue项目安装good-storage插件,输入npm install good-storage
4、vue项目安装moment插件,用于格式化时间,输入npm install moment调用方法如下:

 import objmoment from "moment"
 //定义方法
   getCurrentDateTime(time){
            return objmoment(new Date(time)).format('YYYY-MM-DD HH:mm:ss')
        }

你可能感兴趣的:(vue,vue,步骤)