Express+Vue+Axios入门

Express+Vue+axios 入门

1.npm install

• 1. npm init 初始化工程
• 1. npm install -s express

2.搭建express 工程

• 1.使用express工程生成器
• 2.自己编写，有助于自己了解工程
• 3.本节介绍自己的手动工程：
  3.1 创建一个server.js
  3.2 引入express hello-world 内容，确保工程启动OK
  3.3 引入视图引擎，解析html模板，设置模板路径。
  

  

  
  3.4 通过 app.use(express.static('public'));引入js,css等。
  ps:public文件夹必须在项目的根路径，目前发现。应该可以自定为src下，还没有测试。否则css，js无法生效。

3.页面js引入(没有webpack)

• 1.页面中引入vue,axios,自己的业务逻辑模块
• 2.编写自己的业务逻辑
• 3.界面操作，vue点击，触发事件，axios请求server.js ，进行本地nodejs服务操作。
  ps:
  axios发送ajax请求，server.js 中，req 可以拿到query，但是body，需要引入body-parser

         app.use(bodyParser.json({limit: '1mb'}));  //这里指定参数使用 json 格式
         app.use(bodyParser.urlencoded({
         extended: true
         }));

  最后req.body才能取到数据。

            "dependencies": {
             "body-parser": "^1.18.2",
             "ejs": "^2.5.7",
             "express": "^4.16.2"
            }