zoukankan      html  css  js  c++  java
  • npm简单介绍

    安装

    直接安装Node.js即可,安装完成之后重启电脑,然后成功

    简单介绍

    Node.js又是干嘛的?

    JavaScript可以运行在哪里?浏览器对吧.现在我想在电脑上不借助浏览器直接使用JavaScript可以吗?

    可以,Node.js就是这个作用,帮助你在电脑上直接使用JavaScript,所以Node.js是干嘛的?就是一个桥梁,让你可以在电脑上直接使用JavaScript

    npm是干嘛的?

    npm是一个包管理工具,我需要Jquery了,我去官网下载或者引用,我需要Bootstrap了我去官网下载或者引用,我需要Vue了.......

    每一个都去官网自己下载或者找引用链接不麻烦?而且还有版本之间的依赖关系很复杂

    npm帮你解决

    简单操作

    npm init

    我习惯使用VS Code,新建一个目录,调出终端,cd 进入你这个目录.只需要输入

    npm init -y
    

    你会发现多出来一个package.json,这就是npm的初始化

    npm Jquery

    我需要Jquery,安装 i是install的缩写

    npm i jquery
    

    npm Vue

    我需要Vue,安装

    npm i vue
    

    出现的node_modules

    这个时候目录下出现的node_modules,打开看看,有两个包,Jquery和vue

    package.json

    这个时候再看看package.json

    {
      "name": "y",
      "version": "1.0.0",
      "description": "",
      "main": "index.js",
      "scripts": {
        "test": "echo "Error: no test specified" && exit 1"
      },
      "author": "",
      "license": "ISC",
      "dependencies": {
        "jquery": "^3.4.1",
        "vue": "^2.6.11"
      }
    }
    

    dependencies里面有了包的依赖关系了

    这个时候删除node_modules,不要包了,再执行

    npm i
    

    你会发现所有的包又下回来了,所以有package.json就一切ok

    常用命令

    # 初始化
    npm init
    # 根据package.json下载所有的包
    npm i
    # 下载包
    npm i jquery
    # 删除包
    npm uninstall jquery
    # 更新包
    npm update jquery
    # 使用旧版本
    npm i jquery@3.3.0
    
    

    安装webpack

    因为js直接相互引用变量的问题,以及js暴露变量导致冲突覆盖问题,Node.js的模块化解决了这个问题.webpack可以对这种js进行转换,变成浏览器识别的js

    全局安装

    可以全局安装,这样哪个目录都可以使用

    npm i webpack-cli -G
    

    例如下面有两个js

    var msg = "Vae";
    module.exports = {msg:msg};
    
    var msg = require('./b').msg
    console.log('名字是: '+msg);
    

    然后使用webpack打包,记得cd进入你的项目地址

    webpack a.js -o  bundle.js
    

    然后html引用bundle.js即可

    局部安装

    可以在项目中安装webpack,可能不同的项目的webpack版本是不一样的,cd进入目录,执行

    npm i webpack-cli -D
    

    然后使用webpack的时候,这样使用

    node_modules/.bin/webpack a.js -o bunle.js
    
  • 相关阅读:
    Python-OpenCV——进阶操作一网打尽
    深入理解jQuery插件开发
    Bootstrap整合ASP.NET MVC验证、jquery.validate.unobtrusive
    实用的Bootstrap的扩展和插件集合
    hadoop编程小技巧(5)---自定义输入文件格式类InputFormat
    mapreduce作业状态一直是ACCEPTED
    hadoop CLASSNAME命令使用注意点
    运行java的class文件方法详解
    Hadoop、Zookeeper、Hbase分布式安装教程
    java enum(枚举)使用详解 + 总结
  • 原文地址:https://www.cnblogs.com/yunquan/p/12241814.html
Copyright © 2011-2022 走看看