gogogo
管理员
管理员
  • UID25
  • 粉丝0
  • 关注0
  • 发帖数1384
阅读:6211回复:1

移动端开发 常用代码 【大全】webpack & npm常用命令大全

楼主#
更多 发布于:2020-03-26 11:37
vue 使用命令行创建项目:
    1:npm install vue-cli -g
    2:npm install webpack -g
   [全局安装]
     或  npm install --save-dev webpack    [安装到项目目录下]
      npm install webpack-cli --save-dev
      npm install --save-dev webpack-dev-server   [构建本地服务器]
   3:vue init webpack  myapp[ 项目名称 ]
   4:cd myapp
   5:npm install [安装依赖]  

      或  npm init          [创建package.json文件]标准的npm说明文件,里面蕴含了丰富的信息,包括当前项目的依赖模块,自定义的脚本任务等等
   6:npm run dev




手机适配:

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no" />
<meta name="format-detection" content="email=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<script>          
     var bw = (document.documentElement.clientWidth/6.4)+"px";        
     var htmlTag = document.getElementsByTagName("html")[0];        
     htmlTag.style.fontSize=bw;
</script>





ajax:创建交互式网页应用的网页开发的技术    [特点:局部刷新]

封装:    function ajax(url){
       var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : ActiveXObject("microsoft.XMLHttp")
       xhr.open("get",url,true);
       xhr.send();
       xhr.onreadysattechange = () =>{
           if(xhr.readystate == 4){
               if(xhr.status == 200){
                   var data = xhr.responseTEXT;
                   return data;
               }
           }
       }    
   }


   promise[异步编程的解决方案:解决回调嵌套的问题](回调地狱)
   function foo(INTERVAL){
           return new Promise(function(resolve,reject){
                   setTimeout(resolve,INTERVAL);
               })
       }

  webpack 优点:
   1:模块化:让我们把复杂的程序细化为小的文件
命令:
(1):npm install -g webpack   [全局安装]
(2):npm install --save-dev webpack
(3):npm init                  [创建package.json文件]标准的npm说明文件,里面蕴含了丰富的信息,包括当前项目的依赖模块,自定义的脚本任务等等
(4):npm install --save-dev webpack       [安装到项目目录下]
(5):npm install webpack-cli --save-dev
(6):npm install --save-dev webpack-dev-server   [构建本地服务器]
配置:   [文件从哪输入]   [文件从哪输出]
module.exports = {
 
   entry: __dirname + "/app/main.js",//已多次提及的唯一入口文件
 
   output: {
   
       path: __dirname + "/public",//打包后的文件存放的地方
   
   filename: "bundle.js"//打包后输出文件的文件名
 
   }
    }
/////////////////////////////////////////////////////////////////////////////////////
gogogo
管理员
管理员
  • UID25
  • 粉丝0
  • 关注0
  • 发帖数1384
沙发#
发布于:2020-03-26 11:38
node.js:
    [搭建服务器];
const http = require("http");

http.createServer((req,res)=>{
    res.writeHeader(200,{"content-type":"text/html;charset=utf-8"});
    res.write("aaa");
    res.end();
}).listen(8000);
执行此条命令  服务器不会自动刷新 需要自己去 手动运行node

安装  npm install supervisor -g
启动     supervisor xxxx.js
可以不用执行node,自动更新(supervisor)

/////////////////////////////////////////////////////////////////////////////////////////////
Mongodb
npm install mongodb@2.2.33 --save-dev
npm list mongodb --save-dev

   var MongoClient = require("mongodb").MongoClient;
    var url = "mongodb://localhost:27017/mydb";
    MongoClient.connect(url,function(err,db){};



express
   npm init [初始化项目]
   1/全局安装环境 npm install express –g
   2/测试安装成功与否 express –h
   3/安装npm install express-generator –g
   4/脚手架创建项目 express  -e  project_name(项目名字)
   5/安装package.json中的依赖,进入目录cd express,安装依赖npm install
    6/启动npm start  浏览器输入localhost:3000 查看
   npm install express-session --save-dev  [暂时存储可在其他页面请求到]
    npm install async --save-dev     [异步编程]   串行无关联:async.series([],()=>{})   并行无关联:同上
   npm install body-parser --save-dev  [req.body]
ejs的特点:
   (1)快速编译和渲染
    (2)简单的模板标签
    (3)自定义标记分隔符
   (4) 支持文本包含
    (5)支持浏览器端和服务器端
   (6) 模板静态缓存
   (7)支持express视图系统
ejs常用标签:
   (1)<% %>流程控制标签
   (2)<%= %>输出内容标签(原文输出HTML标签)
   (3)<%- %>输出标签(HTML会被浏览器解析)
   (4)<%# %>注释标签 % 对标记进行转义
    (5)<%- include(path) %> 引入  path 代表你引入其他模板的路径 e.g:<%- include("xxx.ejs")%>
   
mocha 测试
  全局安装:    npm install mocha -g
  
需要测试创建测试文件夹:
引入:chai模块:
    var chai = require("chai");

   var expect = chai.expect;
    
    describe("测试性质",function(){
        it("测试条件",function(){expect(函数).to.be.equal()})
        })
    
    

<--项目需要多余安装的插件  及各种
var express = require('express');
var router = express.Router();
var qs = require("querystring");
var ObjectId=require('mongodb').ObjectId;
var  async = require("async");
var mongoClient = require("mongodb").MongoClient;
var url = "mongodb://localhost:27017/mydb";-->
游客


返回顶部