笔者在入职新公司后,新公司的需求需要同时处理前端和后端交互逻辑,笔者在这之前对前端只是在几年前实现过基于jquery的相关功能,对vue相关,基础几乎为0。
在这几年,前端的变化日新月异,从最开始的ES5到现在ES6的普遍应用,开发工具也从基本的eclipse到现在最有竞争力的Jetbrains家族。其中,笔者目前特别钟情于Jetbrains家族。因此,java开发IDE 使用Jetbrains IDEA,数据库客户端使用DataGrids,前端开发目前是使用VS code(这些是前辈的习惯),但我目前是想使用WebStorm。以此供读者参考。
现在是前置工具开发:
1.安装nodejs
2.切换nodejs镜像
有些人提供淘宝镜像,因为官方镜像非常慢,这里切换过程如下(网上很多,在这里只是做个记录)
使用命令行得到原本的镜像地址
npm get registry
> https://registry.npmjs.org/
设成淘宝的
npm config set registry http://registry.npm.taobao.org/
2.换成原来的
npm config set registry https://registry.npmjs.org/
3.安装vue模块
npm install vue
4.webpack模块安装
npm install webpack
特别的,如果全局安装,则在命令行后加 -g 就可以了。
测试代码,保存为vue-test.js文件:
const Vue=require('vue') const mixin = { data() { return { message: 'hello', foo: 'abc' } } } new Vue({ mixins: [mixin], $data () { return { message: 'goodbye', bar: 'def' } }, created () { console.log(this.$data) // => { message: "goodbye", foo: "abc", bar: "def" } } })
通过 node test-vue.js 运行该代码,如果控制台有输出,则说明vue安装正确。