vue.js ide,idea如何创建vue项目

大前提：安装node.js和npm

打开命令提示符（win+R——cmd）

    1. 切换到你想要新建项目的文件夹中下

    2. 运行 npm i -g vue-cli 安装Vue-cli脚手架

    3. 运行 vue init webpack demo(项目名)

    4. cd demo 切换到项目目录下

    5. npm install 初始化

    6. npm run dev 本地运行 浏览器打开localhost:8080即可看到vue项目运行效果

    7. 安装兼容包

npm i node-sass -Dnpm i sass-loader -Dnpm i axios -Dnpm i element-ui -Dnpm i babel-polyfill -Dnpm i es6-promise -D

配置idea
    File - Settings - Languages&Frameworks - JavaScript：修改JavaScript language version为ECMAScript 6，确认
    File - Settings - Plugins：搜索vue，安装Vue.js
    Run - Edit Configurations...：点击加号，选择npm，Name为Dev，package.json选择你工程中的package.json，Command为run，    Scripts为dev,然后就可以直接在idea中运行了。
    继续点击加号，选择npm，Name为Build，package.json选择你工程中的package.json，Command为run，Scripts为build,然后就可以直接在idea中打包了。

修改项目配置

1. 修改/config/index.js文件，找到

port: 8080修改为port: 8070productionSourceMap: true修改为productionSourceMap: false

2. 修改/build/webpack.base.conf.js文件，找到

module.exports = { entry: { app: './src/main.js' },修改为module.exports = { entry: { app: ['babel-polyfill', './src/main.js'] },

3. 在src目录下新建两个文件夹api和utils，在分别在这两个文件夹里创建index.js文件，最后在src/main.js中加入

import 'es6-promise/auto'import promise from 'es6-promise'import Api from './api/index.js'import Utils from './utils/index.js'import ElementUI from 'element-ui'import 'element-ui/lib/theme-chalk/index.css'Vue.prototype.$utils = Utils;Vue.prototype.$api = Api;Vue.use(ElementUI);