vue和webpack项目构建过程常用的npm命令详解

网友投稿 296 2023-01-29


vue和webpack项目构建过程常用的npm命令详解

vue

//最新稳定版

cnphttp://m install vue

//全局安装 vue-cli

cnpm install --global vue-cli

//创建一个基于 webpack 模板的新项目

vue init webpack my-project

//进入项目fATapPGtu目录,运行

cd my-project

cnpm install

cnpm run dev

webpack

//全局安装webpack

cnpm install -g webpack

//安装到你的项目目录

cnpm install --save-dev webpack

//初始化package.json

cnpm init

//使用webpack构建本地服务器

cnpm install --save-dev webpack-dev-server

//运行本地服务器

npm run server

// npm一次性安装多个依赖模块,模块之间用空格隔开

cnpm install --save-dev babel-core babel-loader babel-preset-es2015 babel-preset-react

//css-loader 和 style-loader

cnpm install --save-dev style-loader css-loader

//安装less-loader和less:

cnpm install less less-loader --save-dev

//postcss-loader 和 autoprehttp://fixer(自动添加前缀的插件)

cnpm install --save-dev postcss-loader autoprefixer

//自动根据模版生成html插件

cnpm install --save-dev html-webpack-plugin

//分离CSS和JS文件

cnpmhttp:// install --save-dev extract-text-webpack-plugin

--save和--save-dev的区别

相同点:都是写入到package.json中

不同点:1使用 --save-dev 安装的 插件,被写入到 devDependencies 对象里面去,而使用 --save 安装的插件,则被写入到 dependencies 对象里面去。

2devDependencies  里面的插件只用于开发环境,不用于生产环境,而 dependencies  是需要发布到生产环境的。

总结

以上所述是给大家介绍的vue和webpack项目构建过程常用的npm命令,希望对大家有所帮助,如果大家有任何疑问请给我留言,会及时回复大家的。在此也非常感谢大家对我们网站的支持!


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:共享文件系统软件哪个好(共享文件系统软件哪个好一点)
下一篇:vue中axios的封装问题(简易版拦截,get,post)
相关文章

 发表评论

暂时没有评论,来抢沙发吧~