开始学习Vue

安装Vue.js

方式1

下载Vue.js通过script标签引入。下载地址:https://vuejs.org/js/vue.min.js

方式2

通过CDN加载Vue.js

方式3

通过NPM安装Vue.js,npm的版本要大于3.0版本
全局安装 vue-cli
cnpm install --global vue-cli

vue-cli2.x及Vue-cli3.x是不一样的。
vue-cli2.x创建一个基于 webpack 模板的新项目
vue init webpack my-project
vue-cli3.x创建一个基于 webpack 模板的新项目
vue create my-project
均根据提示创建一个简单的项目即可。
vue-cli2.x生成项目运行方法:

cd my-project
npm install 
npm run dev 

vue-cli3.x生成项目运行方法:

cd my-project
npm install 
npm run serve

项目运行在:http://localhost:8080

vue-cli2.x及vue-cli3.x的区别:

1.创建方式
vue-cli2.x:
vue init webpack 2.0projectName
vue-cli3.x:
vue create 3.0projectName
2.启动打包方式
vue-cli2.x:
npm run dev
vue-cli3.x:
npm run serve
3.目录结构
vue-cli2.x:

├─build
├─config
├─node_modules
├─src
│  ├─assets
│  ├─components
│  └─router
├─static
└─test
    └─unit
        └─specs

vue-cli3.x:

├─public
└─src
    ├─assets
    ├─components
    ├─router
    ├─store
    └─views

可以看出vue-cli3.x后取消了config、build、static、test目录。在文件上vue-cli3.x也没有了Vue.config.js文件,需要可以创建。

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

推荐阅读更多精彩内容