创建一个 src 目录并将下面的文件移动到 src 下
app.js app.json app.wxss components pages sitemap.json utils
npm init -y
npm install webpack webpack-cli --save-dev
npm install copy-webpack-plugin --save-dev
const path = require("path");
const CopyWebpackPlugin = require("copy-webpack-plugin");
module.exports = {
context: path.resolve(__dirname, "src"),
entry: "./app.js",
output: {
path: path.resolve(__dirname, "dist"),
filename: "[name].js",
clean: true,
},
plugins: [
new CopyWebpackPlugin([
{
// fast-glob 语法; 匹配src目录(任何嵌套级别)中的所有文件 https://github.com/mrmlnc/fast-glob#pattern-syntax
from: "**/*",
to: "./",
},
]),
],
mode: "none",
};
// project.config.json
{
"description": "项目配置文件",
"miniprogramRoot": "dist/",
}
npx webpack
上面的步骤作用:
- 将 src 中的文件复制到 dist;
- src/app.js -> dist/main.js
- 让微信开发者工具知道, dist 才是我们要发布的代码
npm i moment lodash
// 使用 babel-loader 处理 js 依赖问题
npm install -D babel-loader @babel/core @babel/preset-env webpack
// .babelrc
{
// https://babeljs.io/docs/en/babel-preset-env
// 此配置 允许您使用最新的 JavaScript,使 JavaScript 包更小!
"presets": ["@babel/env"]
}
手动置入口文件
entry: {
"app": "./app.js",
"pages/index/index": "./pages/index/index.js",
"pages/logs/logs": "./pages/logs/logs.js",
"components/search-bar/search-bar": "./components/search-bar/search-bar.js",
"components/test-component/test-component": "./components/test-component/test-component.js",
},