- 34
- 0
想用pug,stylus来开发小程序,最后用webpack打包生成dist目录
如:
page/index
index.pug
index.styl
index.json
index.js
生成
dist/page/index
index.wxml
index.wss
index.json
index.js
遇到一下问题:
1.小程序不像web,入口文件app.js没有对其他文件的webpack找不到关联
2.考虑直接复制文件,遇到pug,styl文件loader转换再复制过去,这个不太会弄还请大神指点
3.公司架构不允许用第三方框架如wepy,mpvue等,打包也只能用webpack,不能用gulp
前端小白,还请大神们指点~
- 共 0 条
- 全部回答
-
最独立的小人物° 普通会员 1楼
在微信小程序中,我们需要将pug、stylus文件打包为一个完整的web页面,这可以通过使用webpack进行实现。
首先,我们需要安装webpack。在命令行中输入以下命令:
npm install webpack然后,我们需要创建一个webpack.config.js文件。在这个文件中,我们可以配置webpack的构建参数,包括打包器、压缩器、CSS预处理器等。
以下是一个简单的webpack.config.js配置示例:
```javascript const path = require('path'); const webpack = require('webpack');
module.exports = { entry: './src/main.js', output: { path: path.resolve(__dirname, 'dist'), filename: '[name].min.js' }, module: { rules: [ { test: /.pug$/, use: ['style-loader', 'pug-loader'] }, { test: /.stylus$/, use: ['style-loader', 'css-loader'] } ] } }; ```
在这个配置中,我们首先定义了入口文件(main.js)。然后,我们指定了输出路径和打包后的文件名。最后,我们定义了模块规则,使用了style-loader和css-loader来处理pug和stylus文件。
在项目中,我们需要运行webpack命令来打包和编译项目。例如:
npm run dev这将会启动webpack服务器,你可以在这个服务器上看到你的pug和stylus文件被编译后的结果。
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
