webpack 安装以及使用

2018-06-24 01:50:14来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

1、安装webpack

全局安装代码:

npm install -g webpack

2、项目中使用webpack

(1)进入项目目录

cd C:\Users\dell\Documents\HBuilderProject\hello

 

项目目录结构为:

 


 

(2)在项目中生成package.json

npm init

(3)本项目中安装Webpack
npm install --save-dev webpack
(4)编写配置文件
module.exports = {

    //打包入口
    entry: './src/js/main.js',
    //打包后的文件
    output: {
        //不加__dirname 会报错

        //path:__dirname +'./dist/js',
        //filename:'bundle.js'
        //以上2行window下报错 

        path: __dirname,
        filename: './dist/js/bundle.js'

    }
}

(5)本项目使用webpack

执行命令:webpack

webpack执行成功了。

(6)执行webpack配置参数

在package.json中编写webpack配置参数,如:

有个配置项:--display-reasons 是reasons,不是reason

"webpack":"webpack --config webpack.config.js --progress --display-modules --colors --display-reasons"

 

 

执行命令:

npm run webpack

效果:

 

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:CSS3技巧:fit-content水平居中

下一篇:饿了么--VUE项目知识点总结