publite/frontend
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

Switched from snowpack to webpack (Preparing to add serviceworker)

Browse Source
This commit is contained in:
Dmitriy Shishkov 2021-07-31 21:18:16 +03:00
parent df91e5047c
commit c416354cfa
No known key found for this signature in database
GPG Key ID: 14358F96FCDD8060
12 changed files with 128 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.dockerignore
View File

@ -1,3 +1,5 @@
node_modules/
package-lock.json
build/
build/
pnpm-lock.yaml
.vscode

4
.gitignore vendored
View File

@ -1,3 +1,5 @@
node_modules/
package-lock.json
build/
build/
pnpm-lock.yaml
.vscode

27
package.json
View File

@ -1,18 +1,25 @@
{
"private": true,
"scripts": {
"dev": "SNOWPACK_PUBLIC_API_URL=http://localhost:8081 SNOWPACK_PUBLIC_BASE_URL=http://localhost:8080 snowpack dev",
"build": "snowpack build",
"test": "echo \"Error: no test specified\" && exit 1"
"build": "webpack --config ./webpack.config.prod.js",
"dev": "webpack serve --config ./webpack.config.dev.js --stats-error-details",
"test": "echo \"Error: no test specified\" && exit 1",
"h": "cat ./webpack.config.dev.js"
},
"devDependencies": {
"@snowpack/plugin-typescript": "^1.2.1",
"@types/node": "^16.3.3",
"@types/react": "^17.0.14",
"@svgr/webpack": "^5.5.0",
"@types/react": "^17.0.15",
"@types/react-dom": "^17.0.9",
"@types/snowpack-env": "^2.3.3",
"snowpack": "^3.8.0",
"snowpack-plugin-svgr": "^0.1.2",
"typescript": "^4.3.5"
"copy-webpack-plugin": "^9.0.1",
"css-loader": "^6.2.0",
"esbuild-loader": "^2.13.1",
"fork-ts-checker-webpack-plugin": "^6.2.13",
"style-loader": "^3.2.1",
"typescript": "^4.3.5",
"typescript-plugin-css-modules": "^3.4.0",
"webpack": "^5.46.0",
"webpack-cli": "^4.7.2",
"webpack-dev-server": "^3.11.2"
},
"dependencies": {
"react": "^17.0.2",

2
public/index.html
View File

@ -9,6 +9,6 @@
<body>
<div id="root"></div>
<script type="module" src="/dist/index.js"></script>
<script type="module" src="/index.js"></script>
</body>
</html>

28
snowpack.config.js
View File

@ -1,28 +0,0 @@
// Snowpack Configuration File
// See all supported options: https://www.snowpack.dev/reference/configuration
/** @type {import("snowpack").SnowpackUserConfig } */
module.exports = {
plugins: ["@snowpack/plugin-typescript", "snowpack-plugin-svgr"],
packageOptions: {
polyfillNode: true,
},
mount: {
public: "/",
src: "/dist",
},
optimize: {
// bundle: true,
},
routes: [
{ match: "routes", src: "robots.txt", dest: "/robots.txt" },
{ match: "routes", src: ".*", dest: "/index.html" },
],
devOptions: {
open: "none",
},
alias: {
"~": "./src",
},
exclude: ["**/node_modules/**/*", "**/*.test.*"],
};

5
src/constants.ts
View File

@ -1,2 +1,3 @@
export const API_URL = import.meta.env.SNOWPACK_PUBLIC_API_URL;
export const BASE_URL = import.meta.env.SNOWPACK_PUBLIC_BASE_URL;
export const API_URL = process.env.PUBLIC_API_URL;
// export const BASE_URL = process.env.PUBLIC_BASE_URL;
export const CACHE = "v1";

3
src/index.tsx
View File

@ -12,6 +12,3 @@ ReactDOM.render(
document.getElementById("root")
);
if (import.meta.hot) {
import.meta.hot.accept();
}

2
src/utils/api.ts
View File

@ -43,7 +43,7 @@ export const validateResponse = (content: unknown): content is BookT => {
if (content && typeof content === "object")
for (const key of requiredBookProps)
if (!(key in content)) {
if (import.meta.env.NODE_ENV === "development")
if (process.env.NODE_ENV === "development")
console.log(`${key} is not specified in server response`);
return false;
}

13
tsconfig.json
View File

@ -1,17 +1,18 @@
{
"compilerOptions": {
"target": "es6",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"isolatedModules": true,
"forceConsistentCasingInFileNames": true,
"jsx": "react-jsx",
"lib": ["DOM"],
"lib": ["DOM", "webworker"],
"module": "ES2020",
"moduleResolution": "node",
"resolveJsonModule": true,
"paths": {
"~/*": ["./src/*"]
}
},
"resolveJsonModule": true,
"skipLibCheck": true,
"strict": true,
"target": "es6"
}
}

53
webpack.config.common.js Normal file
View File

@ -0,0 +1,53 @@
const path = require("path");
const webpack = require("webpack");
const CopyPlugin = require("copy-webpack-plugin");
const ForkTsCheckerPlugin = require("fork-ts-checker-webpack-plugin");
module.exports = {
entry: {
"index.js": "./src/index.tsx",
"sw.js": "./src/serviceWorker/index.ts",
},
output: {
path: path.resolve(__dirname, `./build/`),
clean: true,
filename: "[name]",
},
module: {
rules: [
{
test: /\.tsx?$/,
loader: "esbuild-loader",
options: {
loader: "tsx",
target: "es2015",
},
exclude: /node_modules/,
},
{
test: /\.css$/,
use: ["style-loader", "css-loader"],
},
{
test: /\.svg$/,
use: ["@svgr/webpack"],
},
],
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".json"],
alias: { "~": path.resolve(__dirname, "src/") },
},
plugins: [
new webpack.DefinePlugin({
"process.env.PUBLIC_API_URL": JSON.stringify(
"https://publitebackend.dmitriy.icu"
),
}),
new ForkTsCheckerPlugin(),
new CopyPlugin({
patterns: [{ from: "./public", to: "." }],
}),
],
};

22
webpack.config.dev.js Normal file
View File

@ -0,0 +1,22 @@
const path = require("path");
const webpack = require("webpack");
const webpackConfig = require("./webpack.config.common");
module.exports = {
...webpackConfig,
mode: "development",
watchOptions: { ignored: /node_modules/ },
devServer: {
contentBase: path.join(__dirname, "build"),
compress: true,
port: 8080,
hot: true,
},
plugins: [
new webpack.DefinePlugin({
"process.env.NODE_ENV": JSON.stringify("development"),
}),
...webpackConfig.plugins,
],
};

18
webpack.config.prod.js Normal file
View File

@ -0,0 +1,18 @@
const { ESBuildMinifyPlugin } = require("esbuild-loader");
const webpack = require("webpack");
const webpackConfig = require("./webpack.config.common");
module.exports = {
...webpackConfig,
optimization: {
minimizer: [new ESBuildMinifyPlugin()],
},
mode: "production",
plugins: [
new webpack.DefinePlugin({
"process.env.NODE_ENV": JSON.stringify("production"),
}),
...webpackConfig.plugins,
],
};