全局安装vue-cli脚手架构建工具:
cnpm install vue-cli -g
初始化vue项目:
vue init webpack vuetest
vue-cli初始化项目选项配置详细解析:
$ vue init webpack vuetext1--------------------- 安装vue-cli,初始化vue项目的命令
? Target directory exists. Continue? (Y/n) y---------------------找到了vuetext1这个目录是否要继续
? Target directory exists. Continue? Yes
? Project name (vuetext1)---------------------项目的名称(默认是文件夹的名称),ps:项目的名称不能有大写,不能有中文,否则会报错
? Project name vuetext1
? Project description (A Vue.js project)---------------------项目描述,可以自己写
? Project description A Vue.js project
? Author (OBKoro1)---------------------项目创建者
? Author OBKoro1
? Vue build (Use arrow keys)--------------------选择打包方式,有两种方式(runtime和standalone),使用默认即可
? Vue build standalone
? Install vue-router? (Y/n) y--------------------是否安装路由,一般都要安装
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n---------------------是否启用eslint检测规则,这里个人建议选no,因为经常会各种代码报错,新手还是不安装好
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? (Y/n)--------------------是否安装单元测试
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? (Y/n) y)--------------------是否安装e2e测试
? Setup e2e tests with Nightwatch? Yes
vue-cli · Generated "vuetext1".
To get started:)--------------------如何开始
cd vuetext1)--------------------进入你安装的项目
npm install)--------------------安装项目依赖
npm run dev)--------------------运行项目
cnpm install
安装sass依赖:(之后在单文件组件里可以通过<style lang="scss" scoped>...</style> 使用)
)
cnpm install node-sass --save-dev
cnpm install sass-loader --save-dev
启动项目:
npm run dev