npm install webpack -g//全局安装webpack 电脑上安装完后: 其中有两个警告: npm WARN optional SKIPPING OPTIONAL DEPENDENCY:fsevents@1.2.7 (node_modules\webpack\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY:  Unsupported platform for fsevents@1.2.7:…
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.7 (node_modules\fsvents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents1.2.7: wanted {"os":"darwin","arch":"any"} (curre…
一.npm初始化 在项目文件夹下执行npm init,根据提示回车或者填写信息.结果是生成packge.json文件. 根据json文件npm install会安装依赖,项目会看到有一个node_modules文件. 二.webpack安装和使用 1.先执行npm install webpack -g,表示全局安装webpack来使用webpack命令 然后执行npm install webpack@1.15.0 --save-dev,表示在项目也安装一个. 2.webpack.config.j…
安装全局koa2:npm install -g koa2 -generator 创建一个koa2文件夹:koa2 -e koa2 进入koa2文件夹:cd koa2 安装npm模块:npm install 显示如下结果,可以看到,英文提示有一个漏洞需要修复 : C:\Users\Administrator\Desktop\koa2-1-1\koa2>npm install npm WARN deprecated swig@1.4.2: This package is no longer main…
引言 前端经过漫长的发展,涌现出了很多实践方法来处理复杂的工作流程,让开发变得更加简便,其中,模块化可以使复杂的程序细化成为各个小的文件,而webpack并不强制你使用某种模块化方案,而是通过兼容所有模块化方案让你无痛接入项目,本文详细介绍webpack安装配置及打包的详细过程. Webpack简单介绍 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(depend…
一:webpack认识 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle. 二:webpack安装 安装准备: 1:安装node最新版本 2:安装npm 成功安装后可cmd查看,可以查看版本号则成功了第一步 全局安装: cmd安装 这样安装一般都是最…
背景 最近开启一个新项目,需要对前端的各类资源文件进行打包,经过多方调研后,决定使用webpack工具.但是网上的教程多是将webpack直接作为服务器使用,而我只是想将其作为单纯的资源打包工具而已.经过多方调研,终于发现如何实现webpack的文件打包功能. 准备 在使用webpack之前,必须先要安装nodejs和npm. 安装完npm后,由于npm国内访问非常慢,可以设置为从淘宝的镜像下载各种资源包. npm config set registry http://registry.cnpm…
webpack安装配置使用教程详解 www.111cn.net 更新:2015-09-01 编辑:swteen 来源:转载 本文章来为各位详细的介绍一下关于webpack安装配置使用教程吧,这篇文章对于不喜欢使用 jspm测试的朋友可以参考一下.   webpack 入门 目录 1 安装 webpack2 初始化项目3 webpack 配置4 自动刷新5 第三方库6 模块化7 打包.构建8 webpack 模板我最近大量使用的是 jspm,但因为用它搭建的前端开发环境中,写测试代码非常困难,而项…
webpack安装 1.安装之前你必须要安装node.js,如果你没安装可以在node.js网去下载node.js 2.全局安装webpack,打开cmd输入npm install webpack -g 3.cmd cd进入当前目录,输入npm init命令,一直按Enter,然后在当前文件夹会出现package.json文件 当前目录为webpackTest webpack就安装成功了 webpack的配置 1.创建项目文件夹,文件夹的名字,不要叫"webpack",并且不要包含大写…
目的:  模块化开发,组件化开发,让代码符合开发规范,更高效 webpack作用:从pack,就知道这是包的意思,比较专业点叫做前端自动化打包构建工具,代码错误检查,预处理,文件合并(打包),代码压缩, 将各种文件包括es6de 文件转化成es5的可以被浏览器识别的文件. webpack安装: 1.node下载安装,最好有git,可以利用git的命令行窗口. node和webpack啥关系呢?为什么要求要有node环境???? webpack官网安装说明:在开始之前,请确保安装了 Node.js…
vue vue-style-loader !css-loader错误 最近在学习vue框架,使用webpack打包vue项目,在执行npm run start的时候 出现如下错误: This dependency was not found: * !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-comp…
本篇博客不是原创,简书的zhangwang写的,原文太长,我这里只是提取了一部分. 原文地址:入门webpack,看这篇就够了 一.Webpack解决了什么问题 问题1.JavaScript这个脚本化语言在互联网的前端大行其道,但其一直被当作玩具语言,与Java.C#等后端语言相比,除了语法混乱.写法随意之外,无法模块化也是被诟病的一点.CommonJS标准中提出了模块化标准,而模块化标准带来的一个新的问题——项目文件增多,依赖复杂.如果工具能帮助我们自动分析文件的依赖关系,那感情是最好的. 问…
1.定位到创建的目录 cd H:\webpacktest 2.初始化: npm init 3.一路回车 4.执行(安装到项目的依赖项中) npm install webpack --save-dev 注意:文件夹千万不要命名为webpack 如果报这个错误: 执行删除命令:重新安装 npm remove npm 重新命名文件夹:webpacktest npm install css-loader style-loader --save-dev 安装到全局环境的命令: npm install we…
早上有点时间大概安装一下webpack,操作一下顺便把步骤记一下,乱乱的,还是记录一下吧! webpack安装步骤:1. 2. 3.一直回车,出现如下图: 4.创建src和dist文件 5.需要在npm中安装lodash依赖: 6.手动创建index.html文件 手葱创建index.js文件 7.执行命令webpack-cli src/index.js --output dist/bundle.js 执行之后报错: 尝试用还是报错 然后用http://www.runoob.com/w3cnot…
在用webpack之前... 或说没有实现组件化之前的web1.0时代! 最终迈向web2..0之后的时代! ===============华丽的分割线================== 安装步骤有两步: 1.首先安装  全局 npm install -g webpack 2.再安装局部 npm install --save-dev webpack 为了控制版本不一的情况,实际情况就是这样. 安装好了就是这样(全局安装即每个目录都可以得到你安装的信息)   好了下一步操作! ==错了. 要先…
webpack环境下,加载css需要 css-loader 和 style-loader. css-loader:使用类似@import和url(...)的方法实现 require的功能: style-loader:将所有计算后的样式加入页面中. 但如果你需要使用sass/scss定义样式,那么为了能正常编译,还需要做如下配置: //在项目下,运行下列命令行 npm install --save-dev sass-loader //因为sass-loader依赖于node-sass,所以还要安装…
npm是随nodeJs安装包一起安装的包管理工具,能解决NodeJS代码部署上的很多问题: 常见的使用场景有以下几种: 允许用户从NPM服务器下载别人编写的第三方包到本地使用. 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用. 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用. nodejs的官网地址:https://nodejs.org/en/ nodejs中文网地址:http://nodejs.cn/ 1.从node.js官网下载最新安装包进行安装 2.wind…
1.局部安装: npm i -D (npm install --save-dev的简写) 安装指定版本:npm i -D webpack @version 安装最新版:npm i -D webpack 安装最新体验版本:npm i -D webpack @beta 2.全局安装: npm i -g webpack…
使用webpack安装vue,import之后,运营项目报错,如下: [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build. 原因: vue有两种形式的代码compil…
webpack安装低于4版本(没有配置webpack.config.js) webpack 无需配置输出参数-o 低版本  1.初始化项目 npm init -y 初始化项目 2.安装webpack@3.6.0版本 npm i webpack@3.6.0 -g 安装webpack@3.6.0版本 3.分别新建一个文件夹src,dist..再在src下新建一个js文件main.js和test.js..main.js引用test.js..此时目录结构如下:                      …
nodejs安装: 1.下载:https://nodejs.org/en/download/ 2.安装node-v6.11.3-x64.msi文件,直接默认安装(next……): 3.验证是否完成安装:cmd 进入后输入命令 node -v  回车能得到nodejs版本号: 输入node 回车再输入console.log('aaaaa') 回车能正常显示输出. 这表示nodejs安装成功. webpack安装: 1.npm安装:在f盘新建文件夹webpack,在webpack文件夹建文件夹dem…
原因: 安装node.js时,不是默认路径安装,环境变量找不到npm,需要改环境变量配置: 原下: 找到安装node.js的安装路径: 改后: 成功: npm i -g cnpm --registry=https://registry.npm.taobao.org 建议默认路径安装:因为运行vue命令的时候,也会需要用到C盘的默认路径C:\Users\lcsbe\AppData\Roaming\npm,要支持也要在环境变量里配置,如果node.js默认安装,就不用再设置npm,vue命令的环境变…
webpack安装大于4.x版本(没有配置webpack.config.js) webpack 输出参数-o 高版本  如果安装的webpack版本大于4+,还需要安装webpack-cli.在没有配置webpack.config.js之前,还需要配置输出参数 webpack ./src/main.js ./dist/bundle.js //没有配置输出参数 -o /没有配置输出参数 -o WARNING in configuration The 'mode' option has not be…
uniapp-npm  install 进入版本后 优先运行全局安装,在HBuilder X终端输入 npm  install 点击回车…
镜像使用方法(三种办法任意一种都能解决问题,建议使用第三种,将配置写死,下次用的时候配置还在): 1.通过config命令 npm config set registry https://registry.npm.taobao.org npm info underscore (如果上面配置正确这个命令会有字符串response) 2.命令行指定 npm --registry https://registry.npm.taobao.org info underscore 3.编辑 ~/.npmrc…
什么是npm npm有两层含义.一层含义是Node的开放式模块登记和管理系统,网址为npmjs.org.另一层含义是Node默认的模块管理器,是一个命令行下的软件,用来安装和管理Node模块. npm不需要单独安装.在安装Node的时候,会连带一起安装npm.但是,Node附带的npm可能不是最新版本,最好用下面的命令,更新到最新版本. npm install npm@latest -g @latest表示最新版本 -g表示全局安装 常用的npm命令 npm help 查看命令列表 npm -l…
今天抽空将我的静态服务 ks-server 之前留下的 bug(在node低版本情况下报错)维护了一下. 当我重新 npm link 时,如下错误: npm WARN ks-server@1.0.2 No repository field. npm ERR! Darwin 17.5.0 npm ERR! argv "/Users/zhuqiang/.nvm/versions/node/v6.4.0/bin/node" "/Users/zhuqiang/.nvm/version…
在学习vue的时候,npm install的时候报错  npm err code 1,当时很郁闷,是‘vue init webpack my-project’命令新建的模版项目 ,怎么会报错,第一次遇到这样的问题,很郁闷. 于是就问了度娘,然后 使用了‘ npm i -g npm ’ 命令,然后再 npm install,npm run dev 的时候就正常能启动项目了.…
1,版本查看 node -v npm -v 2,修改NPM的缓存目录和全局目录路径 D盘node目录下创建两个目录,分别是node_cache和node_global,这是用来放安装过程的缓存文件以及最终的模块配置位置,执行下面这两个命令 npm config set prefix “D:\Program Files\node\node_global” npm config set cache “D:\Program Files\node\node_cache” 配置npm和nodejs的环境变…
npm:查看npm所有命令 自己写包可能用到的命令: npm adduser:注册 npm login:登录 npm whami:查看当前用户名 npm init:初始化包的信息 npm publish:发布包/更新包 npm publish --access=public:发布公共作用域包 npm unpublish xxx(包名) --force:强制删除包 npm unpublish xxx@1.1.1(包名@版本号):删除指定版本包 npm deprecate xxx message(包…